Angular "Unkown Provider" - 如何在 routeProvider 配置中使用工厂？

Question

在玩 Angular 的同时，我试图更好地理解如何使用工厂、服务、常量、路由和其他核心概念。所以我用 node、express、jade 和 angular.

构建了一个简单的演示应用程序

现在我想在 routeProvider 配置中使用一个值。我创建了一个常量，这很好用。为了使其在未来使用时更加灵活，我随后建立了一个工厂，但是失败了 "unknown provider"。这是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 应该是提供者而不是服务。因为 service/factory 在配置阶段无法访问。您需要将 svcState 的实现更改为提供程序，以便它在 angular.

的配置块中可用

提供程序实施后，您可以在配置块中使用 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()
            })

    })

;

Angular "Unkown Provider" - 如何在 routeProvider 配置中使用工厂？

Angular "Unkown Provider" - how to use a factory within routeProvider configuration?

angularjs

angularjs-service

ngroute

angularjs-provider