Question

我试图用UI-Router解析一些链接数据。 bar函数工作正常，并在到达控制器时解析承诺，但drinkers函数向控制器发送承诺。

已解决的bar变量是一个带有drinkers数组的对象，我试图单独解析饮用者，以便控制器上可以获得所有信息。

如何才能正确解析？这是我在路由配置中得到的内容：

resolve: {
    bar: function(api, $stateParams) {
        return new api.getBar($stateParams.id);
    },
    drinkers: ['bar', 'api', function(bar, api) {
        return bar.drinkers.map(function(element){
            return new api.getDrinker(element.id);
        });
    }]
}

Answer 1

有a working plunker

我会说，你几乎就在那里，只是不要使用 new 关键字。这与构造函数（我在这里不期望）有关，而不是通常的函数调用：

  resolve : {
    bar: ['api', '$stateParams', function(api, $stateParams) {
      // instead of this
      // return new api.getBar($stateParams.id);
      // just use this
      return api.getBar($stateParams.id);
    }],
    drinkers: ['bar', 'api', function(bar, api) {
      return bar.drinkers.map(function(element) {
        // no new call
        // return new api.getDrinker(element.id);
        // just this
        return api.getDrinker(element.id); 
      });
    }]
  }

如果两个服务都在get方法中返回promises，我们需要使用$q.all()扩展数组处理

  resolve : {
    bar: ['api', '$stateParams', function(api, $stateParams) {
      return api.getBar($stateParams.id);
    }],
    drinkers: ['bar', 'api', '$q', function(bar, api, $q) {

      var promises = bar.drinkers.map(function(element){
        return api.getDrinker(element.id);
      });

      return $q.all(promises);
    }]
  } 
})

尝试检查here

Answer 2

我在这里看到2个问题。第一个是你的决心取决于另一个，这是不好的，因为它们并行执行。第二是饮酒者决定返回多个承诺。

要解决第一个问题，请将两个结果合并为一个，然后将第二个结合到第一个。

要解决第二个问题，请使用q.all并行执行getDrinker请求并获得单个结果。

以下是两者的伪代码解决方案：

resolve: {
    data: function(api, $stateParams, $q)  {
        return api.getBar($stateParams.id)
            .then(function(resp) {
                var bar = resp.data, reqArr = [];

                 bar.drinkers.forEach(function(d) {
                     reqArr.push(api.getDrinker(d.id));
                 });

                 $q.all(reqArr).then(function(drinkers) {
                     return {
                         bar:bar,
                         drinkers:drinkers
                     };
                 });
             });
    }
}

现在在您的控制器中，注入data并使用data.bar和data.drinkers。

UI-Router解析向控制器发送的承诺

2 个答案: