0

異なるビューに 2 つのコントローラー (異なる 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>

items.html

 <html>
    <head>

    </head>
    <body>

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

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

/Load を呼び出してデバッグすると、location.html コンテンツが表示され、controllerLocation も読み込まれます。しかし、 $location.path("/Items"); の後 items.html をロードしていますが、controllerItem をロードしておらず、エラーenter code herehttp://errors.angularjs.org/1.2.22/ng/areq?p0=itemsCtrl&p1=not%20aNaNunction%2C%20got%20undefinedをスローしています。

何が問題なのかを見つけるのを手伝ってもらえますか?

4

1 に答える 1