在UI的路由器解决嵌套的承诺(Nested promises in ui-router resolv

2019-09-28 14:56发布

我一直在努力与下列问题时:

我想获得一些数据的视图显示之前,(决心)。 但一些数据是dependend另一个承诺的结果。

它是这样的:我从$ stateParams作业ID(指数),并期待在我服务的数据。 一旦完成,从这个结果(工作),我可以查找的设置和地板(分别来自不同的服务),都返回一个承诺。

我已经想出了至今

jobinfo: function(Jobs, Floor, JobSetting, $stateParams, $q) {

    var defer = $q.defer();

        Jobs.getByIndex($stateParams.index)
        .then(function(job) {
            console.log('got jobs');
            $q.all({floors: Floor.getByJob(job), settings: JobSetting.getByJob(job)})
            .then(function(info) {
                console.log('got info');
                defer.resolve([job, info.floors, info.settings]);
            });
        });

    return defer.promise;
}

取2

jobinfo: function(Jobs, Floor, JobSetting, $stateParams, $q) {

    return Jobs.getByIndex($stateParams.index)
        .then(function(job) {
            console.log('got jobs');
            return $q.all({floors: Floor.getByJob(job), settings: JobSetting.getByJob(job)})
            .then(function(info) {
                console.log('got info');
                return [job, info.floors, info.settings];
            });
        });
}

似乎都失败了,我甚至不得到console.log回来。

PS:我离开的代码进行的其余部分,很明显,他们被包裹在一个

resolve: {
...
}

并在正确的地方定义。

可能有人会这么温柔点我走出了正确的方向?


我结束了该解决方案是以下几点:(感谢avcajaraville)

job: function(Jobs, $stateParams) {
    return Jobs.getByIndex($stateParams.index);
},

floors: function(Floor, job) {
    return Floor.getByJob(job);
},

settings: function(JobSetting, job) {
    return JobSetting.getByJob(job);
}

Answer 1:

我喜欢解析器分开。

你可以注入每个解析器这样的价值:

job : function( Jobs, $stateParams, $q ) {
    var defer = $q.defer();
    Jobs.getByIndex( $stateParams.index, function( job ) {
        defer.resolve( job );
    });
    return defer.promise;
},

floor : function( Floor, job, $q ) {
    var defer = $q.defer();
    Floor.getByJob( job, function( floor ) {
        defer.resolve( floor );
    });
    return defer.promise;
},

settings : function( JobSetting, job, $q ) {
    var defer = $q.defer();
    JobSetting.getByJob( job, function( settings ) {
        defer.resolve( settings );
    });
    return defer.promise;
},

从UI的路由器的文档 :

决心属性是一个映射对象。 地图对象包含的键/值对

  • 键 - {字符串}:一个依赖的名称被注入到所述控制器。
  • 工厂 - {字符串|功能}:

[...]

如果函数,那么它被注入和返回值被视为依赖。 如果结果是一个承诺,控制器进行实例化之前就得到解决,其价值被注入到控制器。



Answer 2:

尝试这个

jobinfo: function(Jobs, Floor, JobSetting, $stateParams, $q) {

              var defer = $q.defer();

              Jobs.getByIndex($stateParams.index)
                  .then(function(job) {
                      console.log('got jobs');
                      var floors = Floor.getByJob(job);
                      var settings = JobSetting.getByJob(job);
                      $q.all([floors, settings])
                      .then(function(info) {
                          console.log('got info');
                          defer.resolve([job, info[0], info[1]]);
                      });
                  });

              return defer.promise;
          }


文章来源: Nested promises in ui-router resolve