AngularJS 控制器不工作

Question

使用最新的 ng 库，我尝试了以下方法。

这个文件：

<!DOCTYPE html>
<html>
<head>
    <title>Listing 4-2</title>
    <script src="js/angular.min.js"></script>
    <script>
        function MyFilterDemoCtrl($scope) {

            var someData = {
                firstName: 'JENNA',
                surname: 'GRANT',
                dateJoined: new Date(2010, 2, 23),
                consumption: 123.659855,
                plan: 'super-basic-plan'
            };

            $scope.data = someData;

        }
    </script>

</head>
<body ng-app ng-controller="MyFilterDemoCtrl">

<p>
    <!-- Unfiltered data -->
    <strong>First Name</strong>: {{data.firstName}}<br/>
    <strong>Surname:</strong> {{data.surname}}
</p>

<p>
    <!-- Filtered data -->
    <strong>First Name</strong>: {{data.firstName | lowercase}}<br/>
    <strong>Surname:</strong> {{data.surname | lowercase }}
</p>

</body>
</html>

显示此输出：

First Name: {{data.firstName}}
Surname: {{data.surname}}

First Name: {{data.firstName | lowercase}}
Surname: {{data.surname | lowercase }}

为什么？

顺便说一句 - MyFilterDemoCtrl 控制器在这里的唯一任务是使数据对视图可用。正如您在上一章中回忆的那样，将它放在作用域中可以做到这一点。

谢谢。

J.

Answer 1

你必须告诉 Angular 控制器，像这样：

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

myApp.controller('MyFilterDemoCtrl', ['$scope', function($scope) {
    var someData = {
        firstName: 'JENNA',
        surname: 'GRANT',
        dateJoined: new Date(2010, 2, 23),
        consumption: 123.659855,
        plan: 'super-basic-plan'
    };

    $scope.data = someData;
}]);

AngularJS 控制器不工作

AngularJS Controllers dont work

controllers

angularjs