在服务调用中使用 async/await

Question

我无法理解如何在这种情况下使用 async/await。我有一个函数

GetAdditionalProducts()

调用服务并返回结果。我在需要访问结果的其他地方调用该函数，但它在响应可用之前执行该代码。在继续之前如何使用 async/await 等待响应？

  onSearch() {
    this.GetAdditionalProducts();
    //other stuff that requires the response from above function
  }   

  GetAdditionalProducts() {
    this.proposalService.getProductList(this.filter).subscribe(response => {
      this.additionalProducts = response.productList;
    });
  }

Answer 1

我看到你正在使用“订阅”，这意味着 RxJS。您可以使用

toPromise

函数将您的可观察值转换为承诺。

如果您想自己实现，您可以将

this.proposalService.getProductList(this.filter)

调用包装到 Promise 中，然后在“订阅”回调中解析 Promise。

无论您传递给 Promise 的

resolve

是什么，都将是您的 Promise 的返回值，并且在函数上使用

await

时可以访问。

 async GetAdditionalProducts() {
    return new Promise(resolve => {
      this.proposalService.getProductList(this.filter).subscribe(response => {
        resolve(response.productList);
      });
    })
  }

然后，您可以拨打

GetAdditionalProducts

并等待回复。

async onSearch() {
  this.additionalProducts = await this.GetAdditionalProducts();
}