Angular.module不起作用

时间:2015-05-09 07:00:21

标签: angularjs

我是Angularjs的新手并且正在练习它。我有一个这样的简单示例。

我的观点Index.cshtml

<div ng-app="MyApp">    
<div class="show-scope-demo">
        <div ng-controller="MainController">
            <p>Good {{timeOfDay}}, {{name}}!</p>
            <div ng-controller="subController1">
                <p>Good {{timeOfDay}}, {{name}}!</p>
                <div ng-controller="subController2">
                    <p>Good {{timeOfDay}}, {{name}}!</p>
                </div>
            </div>
        </div>
    </div>
</div>

我的控制器是MyJsScript.js

(function (angular) {

angular.module('MyApp', []).controller('MainController', ['$scope', function ($scope) {
    $scope.timeOfDay = 'morning';
    $scope.name = 'sapan';
}]);
angular.module('MyApp', []).controller('subController1', ['$scope', function ($scope) {
    $scope.name = 'sapan';
}]);
angular.module('MyApp', []).controller('subController2', ['$scope', function ($scope) {
   $scope.timeOfDay = 'Evening';
    $scope.name = 'Tapan';
}]);
})(window.angular);

在这种情况下我收到错误

  

“[ng:areq] Argument'MainController'不是函数,未定义”

但如果我像这样更换我的控制器

(function (angular) {
var myApp = angular.module('MyApp', []);
myApp.controller('MainController', ['$scope', function ($scope) {
    $scope.timeOfDay = 'morning';
    $scope.name = 'sapan';
}]);
myApp.controller('subController1', ['$scope', function ($scope) {
    $scope.name = 'sapan';
}]);
myApp.controller('subController2', ['$scope', function ($scope) {
    $scope.timeOfDay = 'Evening';
    $scope.name = 'Tapan';
}]);
})(window.angular); 

它完美无缺地运行。

任何人都可以告诉我这两种语法之间的确切区别。

1 个答案:

答案 0 :(得分:2)

每次致电

angular.module('MyApp', [])

定义一个名为&#34; MyApp&#34;的模块(从而有效地覆盖先前使用相同名称定义的模块)。

要获得对先前定义的名为&#34; MyApp&#34;的模块的引用,正确的语法是

angular.module('MyApp')

没有依赖项数组。