Angular JS Promise所有顺序

时间:2018-10-12 16:12:11

标签: javascript angular promise angular2-services

我正在尝试执行带有承诺的3个Web服务,并且我希望一旦它们全部执行,如果可能的话,我将返回这3个服务的信息。 我有这个。

这是我的服务

getServices(url: string): Promise < any > {
  return this.http.get(CoordinadoresService.BASEURL + url)
    .toPromise()
    .then(response => {
      return response.json();
    })
    .catch(err => err);
}

这是我的组成部分

getOffices() {
  this.oficinas["coordinadores"] = [];
  let data = this.util.getLocalStorage("coordinadores");
  let promises = [];
  if (data != undefined) {
    for (let i = 0; i < Object.keys(data.coordinadores).length; i++) {
      let url = `getOficinas/${data.coordinadores[Object.keys(data.coordinadores)[i]].ip}/${Object.keys(data.coordinadores)[i]}`;
      promises.push(this.services.getServices(url).then(response => {
          response["coordinador"] = response.coordinador;
          this.oficinas["coordinadores"].push(response)
        },
        err => err));
    }

    Promise.all(promises).then(data => {
      console.log('Both promises have resolved', data);
    });
  }
}

但是在这里,他给了我不确定的回信。为什么?

Promise.all(promises).then(data => {
  console.log('Both promises have resolved', data);
});

谢谢。

2 个答案:

答案 0 :(得分:2)

实施中存在一些问题。

  1. 首先,如果您使用HttpClient,则不必map,然后在响应中调用json
  2. 您没有从then的{​​{1}}返回。因此,this.services.getServices(url)
  3. 中没有响应

以下是解决方法。


Promise.all

答案 1 :(得分:0)

您在console.log中获得未定义的原因是此代码

  promises.push(this.services.getServices(url)
 .then(response => {
      response["coordinador"] = response.coordinador;
      this.oficinas["coordinadores"].push(response);
      // nothing returned
  }, err => err));

由于没有返回任何内容(在有注明的地方),推送到承诺中的承诺将解析为undefined

只需添加一个return response

请注意:response["coordinador"] = response.coordinador;是多余的,就像在说a = a-因此,我在下面的代码中不再重复

this.oficinas["coordinadores"]也是this.oficinas.coordinadores-因此将使用后者

  promises.push(this.services.getServices(url)
 .then(response => {
      this.oficinas.coordinadores.push(response);
      // something returned
      return response;
  }, err => err));

关于您问题的另一部分...您想“顺序”执行此操作

如果您可以使用async / await-更改起来非常简单

async getOffices() { // add async keyword
    this.oficinas.coordinadores. = [];
    let data = this.util.getLocalStorage("coordinadores");
    let results = []; // no longer dealing directly with promises, so lets rename this
    if (data != undefined) {
        for (let i = 0; i < Object.keys(data.coordinadores).length; i++) {
            let url = `getOficinas/${data.coordinadores[Object.keys(data.coordinadores)[i]].ip}/${Object.keys(data.coordinadores)[i]}`;
            // await the promise
            let result = await this.services.getServices(url).then(response => {
                this.oficinas.coordinadores.push(response);
                return response;
            }, err => err);
            // push the result
            results.push(result);
        }
        // output the result
        console.log('Both promises have resolved', results);
    }
}

和-因为

let url = `getOficinas/${data.coordinadores[Object.keys(data.coordinadores)[i]].ip}/${Object.keys(data.coordinadores)[i]}`;

看起来很杂乱,让我建议一个替代方法

async getOffices() {
    this.oficinas.coordinadores. = [];
    let data = this.util.getLocalStorage("coordinadores");
    let results = [];
    if (data != undefined) {
        for (let [key, {ip}] of Object.entries(data.coordinadores)) {
            const url = `getOficinas/${ip}/${key}`;
            let result = await this.services.getServices(url).then(response => {
                this.oficinas.coordinadores.push(response);
                return response;
            }, err => err);
            results.push(result);
        }
        console.log('Both promises have resolved', results);
    }
}