猿问

简单问题：为什么angular js无法正常工作？

我写了一段简单代码，使用了angular js，可是不知道为什么，程序并没有响应我的代码，代码如下：

<!DOCTYPE html><html ng-app>
    <head>
        <title>js </title>
       <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
    </head>
    <body>
        <table ng-controller="BasketCtrl">
            <tr><td>Item:</td><td>{{description}}</td></tr>
            <tr><td>cost:</td><td>{{cost}}</td></tr>
            <tr><td>qty:</td><td><input type="number" ng-model="qty"></td></tr>
            <tr><td>subtotal:</td><td>{{qty * cost|currency}}</td></tr>
        </table>
        <script src="./js/test1.js"></script>
    </body></html>

test1.js是我自己定义的一小段js：

function BasketCtrl($scope) {
    $scope.description='Singe ticket';
    $scope.cost=8;
    $scope.qty=1;
}

然而，似乎并不能正确运行：

那个cdn是用的网上一个叫“菜鸟教程”所提供的，没有问题。
作为新手实在是不明白自己这段代码的问题所在，希望有朋友和大神可以指出，谢谢~

蝴蝶不菲
浏览 522回答 1
1回答

炎炎设计

你使用的Angular版本是1.4.6，而在Angular1.3.0及其后版本中，不允许直接在根节点上(rootScope)上挂载控制器，而你写的代码中是直接注册了控制器，所以控制台必定会报错。解决方法是创建模块，即在HTML中设置ng-app="basket"在JS中：var&nbsp;app&nbsp;=&nbsp;angular.module('basket');&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //&nbsp;创建的模块名，在ng-app中使用此名称app.controller('BasketCtrl',&nbsp;function&nbsp;BasketCtrl($scope)&nbsp;{&nbsp;//&nbsp;在模块上注册控制器 &nbsp;&nbsp;&nbsp;&nbsp;$scope.description='Singe&nbsp;ticket'; &nbsp;&nbsp;&nbsp;&nbsp;$scope.cost=8; &nbsp;&nbsp;&nbsp;&nbsp;$scope.qty=1; })
0
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答