时间戳

首页 > 解决方案 > 当用户调用 API 时，构建 observables 数组，并在所有解析时执行块

angular - 当用户调用 API 时，构建 observables 数组，并在所有解析时执行块

问题描述

我想在用户与页面交互时构建一个可观察的列表。每个 observable 都是单独订阅的，但我希望在进行单独或多个并发 API 调用后调用另一个函数。

我让每个函数都将一个 observable 推送到一个数组，并且我有一个 forkJoin 并订阅了我的 ngOnInit 中的数组，但这只会触发一次。如何进行实时订阅，一旦所有当前 API 调用返回并在用户继续进行 API 调用时继续这样做，它将执行回调函数？

例如，用户单击“创建事物”，然后什么也不做。

forkJoin(thingsInProgress).subscribe(() => doStuffWhenAllResolve())

...

createThing() {
    const = this.thingService.createThing().pipe(tap(() => doStuff()));
    thingsInProgress.push(createThing$);
    createThing$.subscribe();
}

deleteThing() {
    ...
}

updateThing() {
    ...
}

我想doStuff()开火，然后doStuffWhenAllResolve()开火。或者，如果用户在毫秒内单击“创建事物”、“删除事物”、“更新事物”，doStuff()则（例如）每个都doStuffWhenAllResolve()调用一次，并且全部调用一次。

然后，如果用户真的很快地创建了 10 个以上的东西，doStuffWhenAllResolve()则在所有重叠的 API 调用返回后再次调用。

我在这里寻找什么 RXJS 运算符？

标签： angulartypescriptrxjs

解决方案

我会做一个BehaviorSubjectwhere createThing(), deleteThing(), 并且updateThing()每个都发出并将它与一个debounceTime.

像这样的东西：

actionMade$ = new BehaviourSubject(new Date());

this.actionMade$.pipe(
  debounceTime(100), // Up to you to play with this 100, basically how long in ms does it have 
                     // to wait before accepting a new actionMade$
  switchMap(() => forkJoin(thingsInProgress)),
).subscribe(() => doStuffWhenAllResolve());

createThing() {
  ...
  this.actionMade$.next(new Date());
}

deleteThing() {
  ...
  this.actionMade$.next(new Date());
}

updateThing() {
  ...
  this.actionMade$.next(new Date());
}

ngOnDestroy() {
  this.actionMade$.complete();
}

==================================================== == 一定要取消订阅（使用 sub.unsubscribe 或 takeUntil），否则它们会造成内存泄漏。

推荐阅读