Angular Typescript - 异步等待内部订阅

Question

我有这样的功能；

openModalWhenRemoveItem() {
  callRemoveService();
  openMyModal();
}

callRemoveService()函数有一个 subscribe 并且它是异步函数，必须在callRemoteService()之后调用openMyModal()函数

callRemoveService() {
  combineLatest(myAccountSelector$, myCompanySelector$).pipe(
    switchMap(res) => 
    this.myService.remove(res[0].id, res[1].id))
    .subscribe((res)=> console.log(res))
}

我需要创建一个必须等待内部认购的功能callRemoveService()调用之前openModal() 我想尝试使用async await但我找不到解决方案。 我这样试过：

async callRemoveService() {
  await combineLatest(myAccountSelector$, myCompanySelector$).pipe(
    switchMap(res) => 
    this.myService.remove(res[0].id, res[1].id))
    .subscribe((res)=> console.log(res))
}

openModalWhenRemoveItem() {
  callRemoveService().then(() => {openMyModal();});
  
}

但它不起作用。 我无法将openMyModal()函数放入订阅中。

Answer 1

您的情况的解决方案是从callRemoveService方法返回Observable而不是订阅它。 这种方法需要注意的是，你需要调用subscribe所有在您拨打的地方callRemoveService 。

如果你这样做，那么它是微不足道的：

callRemoveService(): Observable<any> {
  return combineLatest(myAccountSelector$, myCompanySelector$).pipe(
    switchMap(res) => 
    this.myService.remove(res[0].id, res[1].id));
}

然后你的openModalWhenRemoveItem方法变成这样：

openModalWhenRemoveItem() {
  callRemoveService().subscribe(() => {
    openMyModal();
  };
}

Answer 2

combineLatest是一个 RxJS 操作符，它返回一个 Observable。 你不能简单地等待一个 Observable，它不是一个 Promise。 只需订阅它。

callRemoveService(): Observable<any> {
  return combineLatest(myAccountSelector$, myCompanySelector$);
}

进而 ：

openModalWhenRemoveItem() {
  callRemoveService().subscribe(openMyModal);
}

或者，您可以使用lastValueFrom运算符将 Observable 转换为 Promise，并等待它：

callRemoveService(): Promise<any> {
  return lastValueFrom( combineLatest(myAccountSelector$, myCompanySelector$)) ;
}

async openModalWhenRemoveItem() {
  await callRemoveService();
  openMyModal();
}