错误：ng：areq Bad Argument AngularJS

Question

我正在开发一个新的投资组合网站，并希望使用AngularJS来显示我的工作和纯CSS以格式化布局等。

我找到了一个有用的教程，概述了如何构建应用程序以便将来扩展，并设置了如下文件树：

因此每个组件基本上都是迷你MVC。我在app.routes.js中设置了我的路线并组织了app.module.js，如下所示：

app.module.js：

angular.module('app', ['ngRoute', 'appControllers', 'appResources']);
angular.module('appControllers', ['ngRoute']);
angular.module('appResources', ['ngResource']);

app.route.js：

angular.module('app')

    .config(['$routeProvider', function ($routeProvider) {

        'use strict';

        $routeProvider

        // route for the home page
        .when('/', {
            templateUrl : 'app/components/home/home-view.html',
            controller  : 'HomeCtrl'
        })

        // route for the about page
        .when('/about', {
            templateUrl : 'app/components/about/about-view.html',
            controller  : 'AboutCtrl'
        })

        // route for the contact page
        .when('/contact', {
            templateUrl : 'app/components/contact/contact-view.html',
            controller  : 'ContactCtrl'
        });
}]);

所以这是我的设置，现在，我只需要看看路由的每个控制器都在工作，然后我会开始添加我的内容，但我已经立即成为每个视图的控制器的障碍显示为未定义。

这是一个控制器的例子，它们目前都是一样的，但是有不同的信息：

angular.module('appControllers')

    .controller('AboutCtrl', ['$scope', '$http', function ($scope, $http) {
    'use strict';
    $scope.message = 'This will be the about page';
    }]);

html是正确的，并且没有拼写错误，所以我很担心为什么这会显示为错误。

这与我设置模块的方式有关吗？

非常感谢任何帮助。

非常感谢提前。

Answer 1

此错误告诉您HomeCtrl未定义。您需要在<script src="app/components/home/HomeController.js"></script>文件中加入index.html，以便为每个控制器添加此类应用配置。

如果你想避免这种情况，你可以将你的应用程序搭建这样的东西。

(function () {
    "use strict";

    angular.module('appControllers')

        .controller('HomeCtrl', ['$scope', '$http', function ($scope, $http) {
            $scope.message = 'This will be the home page';
        }])

        .controller('AboutCtrl', ['$scope', '$http', function ($scope, $http) {
            $scope.message = 'This will be the about page';
        }]);

})();

没有单一的“最佳”做事方式。这完全取决于您的应用和偏好的需求。