Question

以下命令在控制台中返回错误“ReferenceError：未定义ThingCtrl”

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

myApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.
    when('/things', {templateUrl: 'partial.html', controller: ThingCtrl}).
    when('/things/:id', {templateUrl: 'detail.html', controller: ThingCtrl}).
otherwise({redirectTo: '/things'});
 }]);

myApp.controller('ThingCtrl', ['$scope', '$routeParams', function($scope, $routeParams) {
$scope.thing = [
    {
        'title':'first thing',
        'first':'one',
        'second': 'two',
        'third': 'three'
    }
];

}]);

然而，当控制器被定义为：

时，它可以正常工作

function ThingCtrl($scope, $routeParams) {
        $scope.thing = [
    {
        'title':'first thing',
        'first':'one',
        'second': 'two',
        'third': 'three'
    }
  ]
};

为什么使用模块化语法不起作用？

Answer 1

我认为问题出在这里：

when('/things', {templateUrl: 'partial.html', controller: ThingCtrl})

这告诉Angular指向ThingCtrl对象，该对象未定义并导致错误。

尝试将控制器名称括在引号中，如下所示：

when('/things', {templateUrl: 'partial.html', controller: 'ThingCtrl'})

这应该允许Angular正确使用依赖注入。

使用$ routeParams时，angular.js模块化控制器“未定义”

1 个答案: