Angular「Unkown Provider」 - 如何在routeProvider配置中使用工廠？

Question

在玩弄Angular時，我試着更好地理解如何使用工廠，服務，常量，路由和其他核心概念。所以我創建了一個簡單的演示應用程序，包含節點，表達，翡翠和角度。

現在我想在routeProvider配置中使用一個值。我創建了一個常量，這工作正常。爲了使它在將來的使用中更加靈活，我建立了一個工廠，但是這個失敗與「未知的提供者」有關。這是一個在Angular中實例化序列的問題嗎？爲什麼我不能將工廠注入.config部分？在我嘗試使用服務而不是工廠的同樣的錯誤之前。希望我沒有犯一個簡單的錯字或語法錯誤，到目前爲止我沒有找到任何。

angular 
    .module('main', [ 
    'ngRoute' 
    ]) 

    .constant('cApp', { 
     'defaultPath': '/home' 
    }) 

    .factory('svcState', function(){ 
     var appState; 

     function getState(){ 
      return appState; 
     } 

     function init() { 
      appState='/home'; 
     } 

     init(); 

     return{ 
      getState: getState 
     }; 
    }) 

    .config(function($routeProvider, svcState, cApp){ 

     $routeProvider 
      .when('/home', { 
       templateUrl: "partials/home" 
      }) 
      .when('/info', { 
       templateUrl: "partials/info" 
      }) 
      .otherwise({ 
       //redirectTo: cApp.defaultPath // this works fine 
       redirectTo: svcState.getState // this fails with "Error: [$injector:unpr] Unknown provider: svcState" 
      }) 

     }) 

; 

Answer 1

svcState應該是提供者而不是服務。因爲服務/工廠在配置階段不可訪問。您需要將svcState的實現更改爲提供程序，以便它可以在角度的配置塊中使用。

執行提供程序後，您可以在配置塊中使用svcStateProvider注入該提供程序。

.config(function($routeProvider, svcStateProvider, cApp){ 

    $routeProvider 
     .when('/home', { 
      templateUrl: "partials/home" 
     }) 
     .when('/info', { 
      templateUrl: "partials/info" 
     }) 
     .otherwise({ 
      redirectTo: svcStateProvider.getState() //<--change herer 
     }) 

    }) 

看this answer更多地瞭解供應商

Answer 2

這是我改變了：

angular 
    .module('main', [ 
     'ngRoute' 
    ]) 

    .provider('appState', function(){ 
     var appState; 

     this.setState = function(newState) { 
      appState = newState; 
     }; 

     this.getState = function() { 
      return appState; 
     }; 

     this.$get = function() { 
      return appState; 
     }; 

     function init() {appState='/home';} 
     init(); 

    }) 
    .config(function($routeProvider, appStateProvider){ 

     $routeProvider 
      .when('/home', { 
       templateUrl: "partials/home" 
      }) 
      .when('/info', { 
       templateUrl: "partials/info" 
      }) 
      .otherwise({ 
       redirectTo: appStateProvider.getState() 
      }) 

    }) 

;