AngularJS 控制器.为什么代码 ID 不起作用


<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
</head>
<body>
<div data-ng-app="myApp" data-ng-controller="SimpleController">
    <h3>Adding a Simple Controller</h3> 
    <input type="text" data-ng-model="demons"/> {{demons}}
    <ul>
        <li data-ng-repeat="foo in ManiacArray | orderBy: 'name'">{{foo.name | uppercase }} => {{foo.state | lowercase }}</li>    
    </ul>
</div>
<script type="text/javascript">
    var app = angular.module(myApp, []);
    app.controller('SimpleController' function($scope){
        $scope.ManiacArray = [
        {name: 'Akshay Raina', state: 'Jammu Kashmir'},
        {name: 'Vikram Kaintura', state: 'Uttarakhand'},
        {name: 'Ronak Furia', state: 'Gujarat'},
        {name: 'Bhagyashree Shetty', state: 'Manglore'},
        {name: 'Bhavna Kamble', state: 'Maharashtra'},
        {name: 'Navin Tiwari', state: 'Uttar Pradesh'},
        {name: 'Nikung Mishra', state: 'Bihar'},
        {name: 'Ashish Natani', state: 'Rajasthan'},
        {name: 'Malaya Dalai', state: 'Orrisa'},
        {name: 'Pearl D'mello', state: 'Goa'},
        ];
    });
</script>
</body>
</html>

我不确定为什么这不起作用..我尝试修复..但我失败了..我正处于学习阶段,所以无法弄清楚这出了什么问题。

  1. var app = angular.module(myApp, []);替换为

    var app = angular.module("myApp", []);

  2. app.controller('SimpleController' function($scope){替换为 app.controller('SimpleController', function($scope){

新代码,

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
</head>
<body>
<div data-ng-app="myApp" data-ng-controller="SimpleController">
    <h3>Adding a Simple Controller</h3> 
    <input type="text" data-ng-model="demons"/> {{demons}}
    <ul>
        <li data-ng-repeat="foo in ManiacArray | orderBy: 'name'">{{foo.name | uppercase }} => {{foo.state | lowercase }}</li>    
    </ul>
</div>
<script type="text/javascript">
    var app = angular.module("myApp", []);
    app.controller('SimpleController', function($scope){
        $scope.ManiacArray = [
        {name: 'Akshay Raina', state: 'Jammu Kashmir'},
        {name: 'Vikram Kaintura', state: 'Uttarakhand'},
        {name: 'Ronak Furia', state: 'Gujarat'},
        {name: 'Bhagyashree Shetty', state: 'Manglore'},
        {name: 'Bhavna Kamble', state: 'Maharashtra'},
        {name: 'Navin Tiwari', state: 'Uttar Pradesh'},
        {name: 'Nikung Mishra', state: 'Bihar'},
        {name: 'Ashish Natani', state: 'Rajasthan'},
        {name: 'Malaya Dalai', state: 'Orrisa'},
        {name: 'Pearl D'mello', state: 'Goa'},
        ];
    });
</script>
</body>
</html>

有两件事是错误的:

  1. 这条线var app = angular.module(myApp, []); 应该是var app = angular.module("myApp", []); 您需要使用字符串初始化模块。

  2. 在控制器中,您错过了一个逗号: app.controller('SimpleController', function($scope){

最新更新