Angular 2 承诺/可观察链两个事件？答案

【问题标题】：Angular 2 promise/observable chain two events?Angular 2 承诺/可观察链两个事件？
【发布时间】：2016-09-29 10:16:23
【问题描述】：

我想知道 observable 或 promise 是否可以在 angular 2 的以下用例中使用：

有两个异步上传任务。我想知道如何检测到这两个任务都已完成。

我的上传任务（在 promise 中实现，但如果需要很容易更改为 observable）是这样的：

myService.upload('upload1').then(() => {
})

myService.upload('upload2').then(() => {
})

如何在 promise 或 observable 中将这两个事件链接在一起，以便我知道这两个任务都已完成？谢谢

【问题讨论】：

标签： angular

【解决方案1】：

使用forkJoin，相当于Angular 1.x 中的$q.all（a 和b 是可观察的）：

Rx.Observable.forkJoin([a,b]).subscribe(t=> {
        var firstResult = t[0];
        var secondResult = t[1];
});

【讨论】：

【解决方案2】：

您可以将Combining Operators 之一与可观察对象一起使用。例如，Observable.zip() 与 Promise 一起使用...

Observable.zip(
    first,
    second,
    function (firstResolvedValue, secondResolvedValue) {
        return firstResolvedValue && secondResolvedValue;
    }
)

zip 接受可变数量的 Observables 或 Promises 作为参数，后跟一个函数，该函数接受每个 Observables 发出或由这些 Promises 解析的一个项目作为输入，并生成一个由结果 Observable 发出的项目.

【讨论】：

【解决方案3】：

complete在所有源流关闭时执行。

Rx.Observable.merge(
  myService.upload('upload1'),
  myService.upload('upload2').subscribe({complete: () => { ... });

如果你想设置等待结果的最大数量

Rx.Observable.merge(
  myService.upload('upload1'),
  myService.upload('upload2')
.take(2)
.subscribe({complete: () => { ... });

【讨论】：

但收到错误消息：ORIGINAL EXCEPTION: ReferenceError: Can't find variable: Rx
应该是这样的：myService1.merge(myService2).subscribe()。但这不是我想要的。我想要的是得到最后一个事件。
您需要最后一个事件，还是只想知道最后一个事件何时发生，这就是 complete 的用途（仅当源 observables 在事件）
是的，我明白了。这有帮助（我调用 complete() 来关闭发件人）。谢谢

【解决方案4】：

您可以使用 Promise.all 来返回一个新的 Promise，当参数数组中的所有 Promise 都已解析时，该 Promise 将解析。

Promise.all([myService.upload('upload1'), myService.upload('upload2')]).then(() => {
  // ...
});

注意，如果您的 myService.upload 方法返回的是 Promise，而不是 Promise，您可以通过以下方式访问返回值：

Promise.all([myService.upload('upload1'), myService.upload('upload2')])
  .then((retValue1, retValue2) => {
  // ...
});

【讨论】：