使订阅同步

Question

我正在为我的公司开发一个项目，并深深尊重我签署的保密协议，我提供以下代码片段，不包含任何敏感信息，请考虑此代码：

toggleLoadingAnimation()
Subscription1()
Subscription2()
…
Subscription10()

toggleLoadingAnimation()

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.10/angular.min.js"></script>

问题是所有订阅方法都是异步的，它们看起来都是这样的：

this.randomFieldSubscription = this.randomService.randomEntityList.value$.subscribe(entityList => {this.entityList =EntityList})

当 .subscribe 执行时，我们还会向 randomService 内的服务器发送请求。

如何使第二个toggleLoadingAnimation()仅在所有先前的订阅完成并且收到服务器的所有响应时才执行？

Answer 1

您可以参考 RxJS 的

forkJoin

方法并执行以下操作：

首先确保使用

firstValueFrom

将你的 Observable 转换为 Promise

toggleLoadingAnimationPromise() {
    return firstValueFrom(this.randomService.randomEntityList());
  }

Subscription1Promise() {
    return firstValueFrom(this.randomService.Subscription1());
  }

forkJoin({
      toggleLoadingAnimation: this.toggleLoadingAnimationPromise(),
      Subscription1: this.Subscription1Promise(),
      Subscription2: this.Subscription2Promise(),
    }).subscribe(({ toggleLoadingAnimation, Subscription1, Subscription2 }) => {
      //your code logic here
      //...
      //your call
      toggleLoadingAnimationPromise().then((data)=>{
       //your code logic
      })
    })
  }