为什么$ stateParams可以解决,但解决方案中没有DI服务?

时间:2014-11-14 20:21:32

标签: angularjs angular-ui-router

我正在尝试在视图呈现之前设置视图以获取一些用户信息,因为来自API的数据将决定用户将看到的视图。我尝试将我的服务放入解决方案,但由于某种原因,在服务内部时未设置$stateParams

.state('order.sharepoint', {
    url: '/sharepoint',
    abstract: true,
    controller: 'SharePointController',
    resolve: {
        OrderResolve: function(Order, $stateParams){ // Here $stateParams
            return Order.fetch();                    //   is set correctly!
        }
    }
});

订购服务

 app.factory('Order', function ($q, API, $stateParams) { // HERE $stateParams 
                                                         // is empty for some reason

    var Order = null;
    var service = {};

    service.fetch = function () {
       /// Here is my API call and everything
    }

1 个答案:

答案 0 :(得分:0)

is a plunker,这个问题适用于Angular and UI-Router, how to set a dynamic templateUrl。在那里,我们可以看到如何使用$stateParamsfactories

一般来说,工厂是创建一次。这是一个单身人士。随着国家的到来,决心被解雇了很多次。 (创建的工厂已经创建......其构造函数不是重用/重置的最佳位置)

这将是一些工厂def:

.factory('GetName', ['$http', '$timeout',
    function($http, $timeout) {
      return {
        get : function(id) {
          // let's get data via $http
          return $http
            .get("dataFromServer.json")
            .then(function(response){

              // simplified converter
              // taking the $http result and 
              // by id gets the name
              var converter = response.data;
              var name = converter[id];

              return {templateName : name}; 
          });
        },
      };
    }
]);

正如我们所看到的,它的构造函数接受对服务的引用,这些服务可以在以后使用,通常在方法内部使用。在这种情况下: get(id)

这是resolver内部的标准调用 - 或者甚至是 templateProvider 中的标准调用。

  $stateProvider
    .state('parent.child', {
      url: '/child/:someSwitch',
      views: {
        "page": {
          templateProvider: function($http, $stateParams, GetName) {

            // async service to get template name from DB
            return GetName
                .get($stateParams.someSwitch)
                // now we have a name
                .then(function(obj){
                   return $http
                      // let's ask for a template
                      .get(obj.templateName)
                      .then(function(tpl){
                          // haleluja... return template
                          return tpl.data;
                   });      
                })

          }, 
          controller: 'viewCtrl',
        }
      }
    });

此示例应显示,factory作为单例,可以使用IoC向依赖服务/工厂注入。状态相关的东西,即变化(即不是单身)必须作为factory方法参数传递...检查here