Question

我有这种情况：

首先，我打电话给服务部门，并获得了一份物品清单。（对象数组）
对于此列表中的每个项目，我都会调用另一项服务，并且实际上它们都可以并行触发。
我必须等待所有答案。当我得到所有答案时，我便有了最终的逻辑。

我现在没有正确使用RxJS就是这样：

this.service.readArray().subscribe((array: Object[]) => {
  if (array.length > 0) {
    array.forEach((item, index) => {

      this.service2.readItem(item.id)
        .subscribe(details => {
          item.details = details;
          // manually finally logic
          if (index === array.length - 1) { // if the last iteration
            ...
          }
        }, (response: HttpErrorResponse) => {
            ...
          // manually finally logic also for error part
          if (index === array.length - 1) { // if the last iteration
          ... 
          }
        });

    });
  } else {
    ... logic for no items in list
  }
}, (error) => {
  ...
});

如何在Rxjs（5）语句中表示这一点？

Answer 1

您可以使用forkJoin等待所有调用完成。看起来您正在使用rxjs 5 [正如您在问题中提到的]，因此让我们像这样更改代码[请参见代码注释中的描述]：

this.service.readArray()
        .switchMap(array => {
          //lets map the array member to the respective observable
          const obs$ = array.map(item => {

             return this.service2.readItem(item.id)
                        .pipe(
                           catchError(err => {

                             //Do whatever you want to do with this error
                             //make sure to return an observable as per your logic. For this example, I am simply returning the err wrapped in an observable. Having catchError operator will gracefully handle the exception and make sure to emit the value as part of forkJoin.
                             return of(err);

                           })
                         )
          });
          //forkJoin will wait for all the readItem calls get finished.
          return forkJoin(obs$);
        })
        .subscribe((finalArray) => {
          //finalArray will be the array of object [an response of this.service2.readItem(item.id)]
          console.log(finalArray);
          //do whatever you want to do with the array
        });

Answer 2

我有一个使用zip功能作为替代版本的解决方案。

https://stackblitz.com/edit/rxjszipmkx

init() {
   const myService = new MyService();

   myService.getList().subscribe((arr) => {
     let observables = arr.map(value => myService.update(value))
    const allObs$ = zip(...observables);
    allObs$.subscribe((result) => {
      console.log("zip", result);
    }, (error) => { console.log(error) })
  })
}

RxJS-使用forEach并等待所有完成的多个请求

2 个答案: