Question

根据文档中的示例，子状态将从父状态继承已解析的依赖关系。此外，您可以通过将子项注入子状态来实例化子项之前解析父依赖项的承诺。

参见文档中的示例：

$stateProvider.state('parent', {
      resolve:{
         resA:  function(){
            return {'value': 'A'};
         }
      },
      controller: function($scope, resA){
          $scope.resA = resA.value;
      }
   })
   .state('parent.child', {
      resolve:{
         resB: function(resA){
            return {'value': resA.value + 'B'};
         }
      },
      controller: function($scope, resA, resB){
          $scope.resA2 = resA.value;
          $scope.resB = resB.value;
      }

但是，如果依赖项是NAMED而不是函数，那么如何执行此操作。例如，请参阅粗体部分：

$stateProvider.state('parent', {
      resolve:{
         resA:  'ServiceA'
         }
      },
      controller: function($scope, ServiceA){
          $scope.ServiceA = ServiceA.value;
      }
   })
   .state('parent.child', {
      resolve:{
         ServiceB: ServiceB
         }
      },
      controller: function($scope, ServiceA, ServiceB){
      }

我无法弄清楚如何使ServiceB在实例化之前等待ServiceA首先被实例化。

我试过把＆＃39; ServiceA＆＃39;作为ServiceB的依赖，但这不起作用。

提前感谢您的帮助。

Answer 1

这与ui-router无关。您只想知道的是如何在另一个服务之前实例化一个服务。答案是你不能，并且需要改变你的设计。

如果ServiceA内的某些内容需要完成以便ServiceB可以使用它，那么您应该在ServiceA内使用promises。例如：

.factory('ServiceA', function($q){
    var deferred = $q.defer();       

    // Do some kind of work here and when complete, run deferred.resolve();

    return {
        myPromise: function() { return deferred.promise; }
    };
});

然后在ServiceB消费：

.factory('ServiceB', function(ServiceA){
    ServiceA.myPromise().then(function(){
        // This will run after your ServiceA work has completed
    });
});

阅读$q文档了解详情：link here

Answer 2

实际上，我想出了怎么做。

这是你做的事情：

$stateProvider.state('parent', {
      resolve:{
         resA:  'ServiceA'
         }
      },
      controller: function($scope, ServiceA){
          $scope.ServiceA = ServiceA.value;
      }
   })
   .state('parent.child', {
      resolve:{
         ServiceB: function(ServiceA, ServiceB) {
            return ServiceB;
         }
      },
      controller: function($scope, ServiceA, ServiceB){
      }

angular-ui router - 为NAMED依赖项继承已解析的依赖项

2 个答案: