4

这是我的 html 和 angular js 代码

<html>
<head>
    <title></title>
    <script src="Scripts/angular.min.js" type="text/javascript"></script>
    <script type="text/javascript" language="javascript">
        function DemoController($scope) {
            $scope.user = {
                dateOfBirth: new Date(1970, 0, 1)
            }
        }
    </script>
</head>
<body>
    <div ng-app="demo" ng-controller="DemoController">
        Date Of Birth:
        <my-datepicker type="text" ng-model="user.dateOfBirth" />
        <br>
        Current user's date of birth: <span id="dateOfBirthDisplay">{{user.dateOfBirth}}</span>
    </div>
</body>
</html>

它不起作用并提供输出

    Date Of Birth: 
    Current user's date of birth: {{user.dateOfBirth}}

但是，如果我="demo"从ng-app="demo"div 中删除它就可以了...

4

3 回答 3

7

当您为ng-app指令分配名称时，您实际上创建了一个具有该名称的模块。在本模块中，您必须定义指令、服务、过滤器和配置。

在您的情况下，当您分配名称“demo”时，您创建了一个名为“demo”的模块。功能DemoController现在不再是该模块的一部分。

要使用此功能并将模块分配给您的应用程序，您需要使用以下定义控制器的方式：

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

app.controller('DemoController', [function () {
    //The body of demo controller
}]);

这样，应用程序就知道需要为相应视图的范围关联哪个模块的控制器。

编辑：ng-app 指令参考

于 2013-06-27T06:45:18.930 回答
1

我的解决方案有效，试试这个：http ://plnkr.co/edit/zwOKitT8wznO17yZfz15?p=preview

<body ng-app="">
    <div ng-controller="DemoController">
        Date Of Birth:
        <br>
        Current user's date of birth: <span id="dateOfBirthDisplay"><span ng-bind="user.dateOfBirth"></span></span>
    </div>
</body>
于 2013-06-27T06:51:52.730 回答
0

ng-app属性的值定义了应用程序的模块名称。在您的情况下，这是“演示”。虽然您没有DemoController在模块“演示”中声明，但使用angular.module调用，它在您的 ng-app html 中不可见，在“演示”模块的范围内执行。

有用的ng-app="demo"是：

<script type="text/javascript" language="javascript">
    angular.module('demo', []).controller('DemoController', function ($scope) {
        $scope.user = {
            dateOfBirth: new Date(1970, 0, 1)
        }
    });
</script>
于 2013-06-27T06:47:06.360 回答