ng-controller不起作用

时间:2014-09-25 19:10:06

标签: angularjs

我是AngularJS的新手。我有一个使用ng-controller的简单代码段。但它不适合我。我该如何修复此代码?

<!DOCTYPE html>
<html ng-app="">
<head>
    <title>AngularJS Demo App </title>
</head>
<body ng-controller="simpleController">
    <br />
    Tags:
    <br />
    <input type="text" ng-model="tags" />{{tags}}
    <ul>
        <li ng-repeat="FriendName in friends|filter:tags | orderBy:'-age'">{{tag.FriendName}}--{{tag.age}}</li>
    </ul>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
    <!--<script src="Scripts/angular.min.js"></script>-->
    <script>
        function simpleController($scope) {

            $scope.friends =
                  [{ name: 'John', phone: '555-1212', age: 10 },
                   { name: 'Mary', phone: '555-9876', age: 19 },
                   { name: 'Mike', phone: '555-4321', age: 21 },
                   { name: 'Adam', phone: '555-5678', age: 35 },
                   { name: 'Julie', phone: '555-8765', age: 29 }];
        }
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

Angular团队刚刚删除了窗口上的全局控制器。所以你必须定义角度模块 并且做@tymeJV告诉你的事情

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <title>AngularJS Demo App </title>
</head>
<body ng-controller="simpleController">
    <br />
    Tags:
    <br />
    <input type="text" ng-model="tags" />{{tags}}
    <ul>
        <li ng-repeat="FriendName in friends|filter:tags | orderBy:'-age'">{{FriendName.name}}--{{FriendName.age}}</li>
    </ul>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.min.js"></script>
    <script>
      angular.module("myApp", []).controller("simpleController", function($scope) {

            $scope.friends =
                  [{ name: 'John', phone: '555-1212', age: 10 },
                   { name: 'Mary', phone: '555-9876', age: 19 },
                   { name: 'Mike', phone: '555-4321', age: 21 },
                   { name: 'Adam', phone: '555-5678', age: 35 },
                   { name: 'Julie', phone: '555-8765', age: 29 }];
        });
    </script>
</body>
</html>