Разные контроллеры в разных файлах для ng-view

Я использую два контроллера (в разных файлах js) для разных представлений.

Мой основной HTML

================================================================================

<html ng-app="MyApp">

<head>

    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script type="text/javascript" src="/JS/utilityJS/angular.min.js"></script>
    <script type="text/javascript" src="/JS/utilityJS/angular-route.js"></script>
     <script type="text/javascript" src="/JS/app.js"></script>
     <script type="text/javascript" src="/JS/controllerLocation.js"></script>
     <script type="text/javascript" src="/JS/controllerItem.js"></script>
</head>

<body>
    <div id="populateDiv" >
         <div id="header"   ng-include src="'/pages/header.html'"></div> 
        <div id="footer" ng-include src="'/pages/footer.html'"></div>
        <div id="groceryBg" class=" mainContentBg" style=""> </div>
        <div ng-view=""></div>
</div>
</body>
</html>

App.js // основной файл js

 angular.module('controllersModule', []);
    var AppModule = angular.module('MyApp', ['ngRoute','controllersModule']);

    AppModule 
    .service('locationService', function ($http) {
    ......  
    }

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


        $routeProvider.
          when('/Load/', {
            templateUrl: 'location.html',
            controller: 'locationCtrl'
          }).
          when('/Items/', {
            templateUrl: 'items.html',
            controller: 'itemsCtrl'
          }).
          otherwise({
            redirectTo: '/Load/'
          });
      }]);

controllerLocation.js // контроллер местоположения

 angular.module('controllersModule').controller('locationCtrl', ['$rootScope', '$scope','$route', '$http','$location','locationService', '$routeParams',
        function($rootScope, $scope, $route,$http,$location,locationService, $routeParams)
        {

    $location.path("/Items");
    }

controllerItem.js // Контроллер элемента

 angular.module('controllersModule').controller('itemsCtrl' ['$rootScope', '$scope', '$route', '$http', 'locationService', '$routeParams',
        function($rootScope, $scope, $route, $http, locationService, $routeParams)
        {


            console.log("Scope id Items is:- " + $scope.$id);

    }

location.html // Расположение HTML

 <html>
    <head>

    </head>
    <body>

     <div> 
    Location.....
    </div>
    </body>
    </html>

элементы.html

 <html>
    <head>

    </head>
    <body>

     <div> 
    Items.....
    </div>
    </body>
    </html>

================================================================================

Когда я вызываю /Load и отлаживаю его, он показывает содержимое location.html и загрузку controllerLocation. Но после $location.path("/Items"); он загружает items.html, но не загружает controllerItem и выдает erroenter code herer http://errors.angularjs.org/1.2.22/ng/areq?p0=itemsCtrl&p1=not%20aNaNunction%2C%20got%20undefined.

Помогите пожалуйста найти в чем проблема?


person 404 Not Found    schedule 14.01.2015    source источник


Ответы (1)


Вы забыли запятую и закрывающую квадратную скобку в объявлении itemsCtrl

angular.module('controllersModule').controller('itemsCtrl', ['$rootScope', '$scope', '$route', '$http', 'locationService', '$routeParams',
function($rootScope, $scope, $route, $http, locationService, $routeParams)
{
    console.log("Scope id Items is:- " + $scope.$id);
}]);
person wvdz    schedule 14.01.2015
comment
Большое спасибо. Это сработало, действительно глупая ошибка с моей стороны. - person 404 Not Found; 14.01.2015
comment
Когда вы публикуете код, постарайтесь минимизировать его, чтобы изолировать проблему, прежде чем публиковать вопрос. - person ps0604; 14.01.2015
comment
Извините за длинное содержание вопроса. Да последует за этим в будущем. - person 404 Not Found; 16.01.2015