Question

我得到的＆＃39; Controller在我的应用程序中不是函数错误。

根据我的阅读，最常见的问题是控制器文件未在html页面中引用 - 对我来说情况并非如此。

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

这是我的文件夹结构：

app.js：

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

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

mainController.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.html的index.html中引用了这样的控制器：

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

Answer 1

当你在另一个文件中使用控制器时，不需要在配置中给出控制器的路径

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

Answer 2

你在使用IIFE吗？如果不是，您不应该分配角度模块 var myApp = angular.module('myApp');上的mainController.js，因为它会覆盖您的myApp变量，因为它被视为全局变量。

如果您想申请IIFE，您的代码应为：

<强> app.js

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

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

<强> mainController.js

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

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

    })();

AngularJS - ＆＃39;控制器不是一个功能：单独的控制器文件

2 个答案: