Question

我在for循环中有两个异步调用的问题。这是场景：我有一个ID数组，对于每个ID，我需要调用rest服务。响应此服务，我需要执行各种操作，然后调用第二个休息服务。我使用第二项服务的响应来完成任务。最后，只有在处理数组的所有元素时，我才需要执行操作。

我找到了这样的解决方案：

let i = 0;
of(...this.idsArray).pipe(
    map(id => {
        return this.myService.getItemById(id).subscribe()
    }),
    tap(data => this.item = data; //How get first response here??? ),
    map(resp => {
        return this.myService.getCatInfo(this.item.cat).subscribe()
    }),
    tap(res => this.cat = res; //How get second response here???)
).subscribe();

我不确定代码是否正确，但是问题是如何获取服务的响应并将其用于Tap函数中？谢谢

编辑：

我正在尝试使用concatMap，但是我得到了更好的行为，但仍然无法正常工作：

let i = 0;
of(...this.idsArray).pipe(
    concatMap(id => {
        console.log('first step');
        return this.myService.getItemById(id).subscribe()
    }),
    tap(data => {this.item = data; console.log('second step')}),
    concatMap(resp => {
        return this.myService.getCatInfo(this.item.cat)
    }),
    tap(res => {this.cat = res; console.log('third step')})
).subscribe();

输出为：

first step
second step
first step
third step
second step
first step
third step
second step
...

Answer 1

您可以使用mergeMap运算符查看。这会将您需要的新订阅添加到后台的http：// observables。

以下是您的代码的大致概念：

of(...this.idsArray).pipe(
    mergeMap(id => {
        return this.myService.getItemById(id);
    }),
    tap(data => this.item = data; //How get first response here??? ),
    mergeMap(resp => {
        return this.myService.getCatInfo(this.item.cat);
    }),
    tap(res => this.cat = res; //How get second response here???)
).subscribe();

在水龙头内，您还可以使用调试器查看此时的状态。

tap(data => {
  debugger;
  this.item = data;
}),

Answer 2

您可以使用 switchMap 避免在内部订阅

of(...this.idsArray).pipe(
 switchMap(id => {
     return this.myService.getItemById(id);
 }),
switchMap(data => this.myService.getCatInfo(data.cat)),
tap(res => this.cat = res; //How get second response here???)
).subscribe();

Angular 6两个依赖异步调用for循环

2 个答案: