在执行下一个函数Angular之前强制等待一个函数答案

【问题标题】：Force wait a function before the execution of next function Angular在执行下一个函数Angular之前强制等待一个函数
【发布时间】：2025-12-05 04:25:01
【问题描述】：

我想在执行继续之前等待一个函数。我该怎么做

openOrganizationDialog(): void {
    const dialogRef = this.dialog.open(NewOrganizationComponent, {
      width: '800px',
      height: '600px',
      data: {
        view: 'dialog'
      }
    });
    dialogRef.afterClosed().subscribe(async result => {

      // Want to wait on below line, so that my list gets updated

      await this.getOrganizations();
      let organizationPreSelectId = this.organizationList[0].orginizationId;
      this.newLoanForm.patchValue({
        orginizationId: organizationPreSelectId
      });

    });
  }

这是我正在谈论的功能

async getOrganizations() {
    await this.organizationService.getOrganizations().subscribe((response) => {
      this.organizationList = response;
      this.organizationList.sort((a, b) => (a.orginizationId < b.orginizationId) ? 1 : -1);
    });
  }

我已经尝试过async await，但它不起作用。在此先感谢您的帮助。

【问题讨论】：

等待订阅不会做任何事情；要么返回一个 observable，要么将其转换为 Promise 并处理它。

标签： angular asynchronous async-await

【解决方案1】：

您需要将您的 observable 转换为一个 Promise，以便它等待。

async getOrganizations() {
    this.organizationList = await this.organizationService.getOrganizations().toPromise();
    this.organizationList.sort((a, b) => (a.orginizationId < b.orginizationId) ? 1 : -1);
}

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

https://www.learnrxjs.io/operators/utility/topromise.html

【讨论】：

像个魔术师一样工作，你能告诉我为什么我的代码不起作用。
我认为有几个原因。一个是调用 subscribe() 返回一个订阅，而不是一个 observable。也等待是想要一个承诺，而不是一个可观察的：typescriptlang.org/docs/handbook/release-notes/…
toPromise 等待订阅完成 - github.com/ReactiveX/rxjs/blob/…。使用这种方法总是更安全地使用在第一个元素上提供订阅完成的管道，例如 .pipe(take(1)) 并保护方法免受“改进”。当然名称getOrganizations() 意味着只有一个元素，但如果是这样，为什么它还不是Promise？在这里使用this.organizationService.getOrganizations().pipe(take(1)).toPromise() 是更好的做法。