javascript - Vanilla AngularJs 没有加载。

Question

我是 Angularjs 的新手。尝试制作一个基本的应用程序。卡住了。

我加载了angularjs

<script type="text/javascript"
src="https://code.angularjs.org/1.4.8/angular.min.js"></script>

在 HTML 中创建了一个简单的表格

<table ng-controller="CalculatorController">
    <thead>
        <tr>
            <th colspan="2">
                <h1>Calculator</h1>
            </th>
        </tr>
    </thead>
    <tr>
        <td>First number</td>
        <td><input ng-model="number1" type="number"></input></td>

    </tr>
    <tr>
        <td>Second number</td>
        <td><input ng-model="number2" type="number"></input></td>
    </tr>
    <tr>

        <td colspan='2'><input type="button" ng-click="sum()"
            value="Add"></input></td>
    </tr>
    <tr>
        <td>Result</td>
        <td>{{result}}</td>
    </tr>
</table>

然后添加了我的 Angular 模块。

<script type="text/javascript">
    //Creates a new module called 'myApp'
    angular.module('myApp', []);

    // Load the app at document ready. 
    angular.element('document').ready(function() {
        angular.bootstrap(document, [ 'myApp' ]);
    });

虽然我还没有添加我的 Controller ，但我希望页面能够正确加载。但是，在浏览器上加载此页面时出现以下错误。

    Error: [jqLite:nosel] http://errors.angularjs.org/1.4.8/jqLite/nosel
Nangular.js:2737
(anonymous function)Calculator.html:47

请帮忙。

Answer 1

jQLite 不支持基于选择器的查询(如果在 AngularJS 之前不包含 jQuery)，基本上它需要在 DOM 元素中。你应该有 document 没有 '(quotes)

代码

angular.element(document).ready(function() {
    angular.bootstrap(document, [ 'myApp' ]);
});