Ошибка: нг: areq Bad Аргумент 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'; 
     }]); 

})(); 

Существует не один «лучший» способ сделать что-то. Все это касается потребностей вашего приложения и предпочтений.