モジュールappRoutesのインスタンス化に失敗しました：[$ injector：unpr]不明なプロバイダ：$ routeProvider

Question

angular-route.jsをindex.htmlページに追加しました。

<script type = "text/javascript" src = "bower_components/angular/angular.js"></script> 
<script type="text/javascript" src="bower_components/angular-route/angular-route.js"></script> 
<script type="text/javascript" src="bower_components/oclazyload/dist/ocLazyLoad.min.js"></script> 
<script type = "text/javascript" src = "public/app/appRoutes.js"></script> 

appRoutes.js：

angular.module('appRoutes', ['ngRoute', 'oc.lazyLoad']).config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 

    $routeProvider 

    .when('/', { 
    templateUrl: 'app/components/in-progress/in-progress.template.html', 
    controller: 'inProgressController', 
    resolve: { 
     lazy: ['$ocLazyLoad', function($ocLazyLoad) { 
     return $ocLazyLoad.load({files: ['app/components/in-progress/in-progress.component.js']}); 
     }] 
    } 
    }) 
.... different routes 
$locationProvider.html5Mode({ 
    enabled: true, 
    requireBase: false 
    }); 

}]); 

私がすべての可能な予防措置をとっているにもかかわらず、$routeProviderによる失敗している理由を私は理解していません。

また、私のメインアプリにもng-routeを追加しました。

角度バージョン：1.5

Answer 1

あなたのコードは 'ngInject' が不足しています。通常はアレイ注入後に必要です。追加してみてください....

angular.module('appRoutes', ['ngRoute', 'oc.lazyLoad']).config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 
'ngInject'; 

     $routeProvider 

     .when('/', { 
     templateUrl: 'app/components/in-progress/in-progress.template.html', 
     controller: 'inProgressController', 
     resolve: { 
      lazy: ['$ocLazyLoad', function($ocLazyLoad) { 
      return $ocLazyLoad.load({files: ['app/components/in-progress/in-progress.component.js']}); 
      }] 
     } 
     }) 
    .... different routes 
    $locationProvider.html5Mode({ 
     enabled: true, 
     requireBase: false 
     }); 

    }]);