javascript - AngularJS - ' Controller 不是函数 : Seperate controller files

Question

我在我的应用程序中收到“ Controller 不是函数”错误。

据我所知，最常见的问题是 html 页面中未引用 Controller 文件 - 我不是这种情况。

当我将 Controller 包含在与声明模块相同的文件中时，我没有收到错误，但是当我为每个 Controller 使用单独的文件时。

这是我的文件夹结构:

app.js:

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

myApp.config(function ($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: 'assets/views/mainView.html',
        controller: 'assets/controllers/mainController.js'
    });
});

ma​​inController.js

var myApp = angular.module('myApp');

myApp.controller('mainController', ['$scope', function($scope){
    $scope.name = "test";
}]);

我还读到，当你声明一个模块时，数组大括号 [] 创建一个新模块，所以我在 mainController.js 中将它们从模块中取出。

如果我这样做，它会起作用:

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

myApp.config(function ($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: 'assets/views/mainView.html',
        controller: 'mainController.js'
    });
});


myApp.controller('mainController', ['$scope', function($scope){
    $scope.name = "hi";
}]);

我在 head 部分的 index.html 中引用了这样的 Controller :

<script src="assets/scripts/js/app.js"></script>
<script src="assets/controllers/mainController.js"></script>

Answer 1

当你在另一个文件中有 Controller 时，不需要给出你在配置中给出的 Controller 路径

    myApp.config(function ($routeProvider) {
$routeProvider.when('/', {
    templateUrl: 'assets/views/mainView.html',
     //Remove this
    //controller: 'assets/controllers/mainController.js'
     //and then try this
       controller: 'mainController'
   });
});