Question

我正在使用Promise.all(...)等待一些REST调用结束，然后再使用服务器上需要的数据。代码结构如下：

const promise1 = this.myService.myFirstRestFunction(a.id).toPromise().then(s => variable1 = s;);

const promise2 = this.myService.mySecondRestFunction(b.id).then(r => {
  this.myService.myThirdRestFunciont(r.id).then(c => variable2 = c);
});

Promise.all([promise1, promise2]).then(p => {
  this.myService.getData(variable1.id, variable2.id)
    .subscribe(...);
});

但是，当我尝试获取variable2字段时，id是不确定的。这和在内部调用的myThirdRestFunction()有关吗？如果是这种情况，我该如何管理这些后续的REST调用并等待获取最内部的数据？谢谢。

编辑：我在@Suren Srapyan和@Sachila Ranawaka回答后更改了代码。

const promise1 = this.myService.myFirstRestFunction(a.id).toPromise();

const promise2 = this.myService.mySecondRestFunction(b.id).then(r => {
  this.myService.myThirdRestFunciont(r.id);
});

Promise.all([promise1, promise2]).then(p => {
  this.myService.getData(p[0].id, p[1].id)
    .subscribe(...);
});

在这种情况下，我可以正确使用p[0]，但是p[1]仍未定义。如果我尝试解决第二个承诺，例如：

const promise2 = this.myService.mySecondRestFunction(b.id).then(r => {
      this.myService.myThirdRestFunciont(r.id).then(c => console.log(c));
    });

对象c已正确记录，因此p[1]不应未定义。

Answer 1

您无需分配变量。 Promise.all将解决所有promise，并将其结果作为数组传递给p参数。

只需从then函数返回数据并通过p[0]中的p[1]和Promise.all(...).then(p => ...)进行访问

const promise1 = this.myService.myFirstRestFunction(a.id).toPromise()

const promise2 = this.myService.mySecondRestFunction(b.id)
                               .then(r => this.myService.myThirdRestFuncion(r.id));

Promise.all([promise1, promise2]).then(p => {
  this.myService.getData(p[0].id, p[1].id).subscribe(...);
});

我不知道您的承诺会返回什么，所以我提供了p[0].id。根据您的结果进行更改。

要获得更漂亮的代码，您还可以销毁参数

Promise.all([promise1, promise2]).then(([var1, var2]) => {
    this.myService.getData(var1.id, var2.id).subscribe(...);
});

Answer 2

不要解决前两个诺言。 Promise.all将为您解决所有承诺

const promise1 = this.myService.myFirstRestFunction(a.id).toPromise() 
const promise2 = this.myService.mySecondRestFunction(b.id) 

Promise.all([promise1, promise2]).then(p => {
  this.myService.getData(variable1.id, variable2.id)
    .subscribe(...);
});

Angular 4-Promise.all不起作用

2 个答案: