AngularJS控制器导致错误

时间:2013-09-18 19:11:36

标签: angularjs

我有一个非常简单的应用程序除了根据用户选择显示两个不同的视图之外什么都不做。该应用程序是了解AngularJS中路线如何工作的垫脚石。

我的问题是这个。

在浏览器中运行时,应用程序导航到索引视图,没有任何问题。这是因为索引视图不引用控制器。但是,用户视图确实引用(要求)控制器。这导致抛出异常的问题是Arguement'XCtrl'不是函数,未定义。

我的主要指标是:

<html>
<head><title></title></head>
<body>
<div ng-view></div>
</body>
</html>

我的主要app.js是:

angular.module('app.controllers', []);

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

angular.module('app', ['app.controllers'])
.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
        when('/', {
            templateUrl: 'views/index.html'
        })
    $routeProvider.when('/users', {
            templateUrl: 'views/users.html',
            controller: 'UserCtrl'
        }).
        otherwise({ redirectTo: '/' });
}]); 

我的控制器是:

appControllers.controller('UserCtrl', ['$scope', function ($scope) {
    $scope.users = {
        user: {name: "Ian", age: 30 },
        user: {name: "Paul", age: 37 }
    };
}]);

user.html

<div ng-repeat="user in users">{{user.name}} {{ user.age }}</div>

的index.html

<h1>index</h1>

任何人都可以看到我出错的地方。任何帮助都会很棒

编辑:

这是来自浏览器的堆栈跟踪,如果这有助于任何

错误:参数'UserCtrl'不是函数,未定义     在错误()     在bb(http://www.testapp.com/js/angular/angular.min.js:17:68)     在ra(http://www.testapp.com/js/angular/angular.min.js:17:176)     在http://www.testapp.com/js/angular/angular.min.js:53:60     在k(http://www.testapp.com/js/angular/angular.min.js:151:401)     at Object.e。$ broadcast(http://www.testapp.com/js/angular/angular.min.js:90:517)     在http://www.testapp.com/js/angular/angular.min.js:83:6     在h(http://www.testapp.com/js/angular/angular.min.js:78:207)     在h(http://www.testapp.com/js/angular/angular.min.js:78:207)     在http://www.testapp.com/js/angular/angular.min.js:78:440

另外:

www.testapp.com是一个本地托管的服务器,没有外部访问权限,以防有人试用它而无法访问。

2 个答案:

答案 0 :(得分:1)

在看到相关问题后,我注意到我没有将UserCtrl.js添加到我的主index.html。添加它后,它工作。但是,我相信有一种方法可以动态添加控制器,指令,服务和过滤器。如果有人知道如何做到这一点,那将非常有帮助。

答案 1 :(得分:0)

在分配期间删除括号

angular.module('app.controllers', []);

var controllers = angular.module('app.controllers');

或者更简单的做htis:

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

如果你放括号,你将有两个模块......