Angular 6 异步等待无法处理 http 请求

Question

您好，我使用 angular 6 通过以下代码调用休息 api。我正在尝试使代码与 async-await 函数同步。然而少了点什么

async save() {

    if (this.changedRecords.length !== 0) {
          this.post('/api/devices/update-devices', this.changedRecords).
          then(x => { console.log("change"); console.log(`Resolved: ${x}`) });
    }
    if (this.newRecords.length !== 0) {
          this.post('/api/devices/new-devices', this.newRecords).
            then(x => { console.log("new"); console.log(`Resolved: ${x}`) });
    }
    if (this.deletedRecords != null) {
      this.post('/api/devices/delete-devices', this.deletedRecords).
        then(x => { console.log("deleted"); console.log(`Resolved: ${x}`) });
    }

}

  async post(url: string, list: DboDevice[]) {
    var result;
    if (list.length !== 0) {
      await this.http.post(url, list).subscribe(result => {
        result = true;
      }, error => {
        console.error(error);
        result = false;
      });
    }
    else {
      result = true;
    }
    return result;
  }

然而，当我运行这段代码时，控制台中的值 return 为 "Resolved: undefined"。这让我相信 await 不会停止 post() 函数中的程序。我在这里做错了什么？

Answer 1

Angular 的 this.http.post return 是一个 RxJS Observable。然后调用 this.http.post(...).subscribe(...) returns RxJS Subscription 对象。所以 none 其中 return Promise 所以你不能将它们与 await.

一起使用

如果你希望能够将 await 与 Observables 一起使用，你必须使用 toPromise() 而不是 subscribe()，return 是一个由第一个解决的 Promise该 Observable 发出的值（它在内部为您调用 subscribe 并用 Promise 对象包装它）。

await this.http.post(...).toPromise(value => {
  ...
});

https://github.com/ReactiveX/rxjs/blob/master/src/internal/Observable.ts#L342-L354

Angular 6 异步等待无法处理 http 请求

Angular 6 Async-await not working on http request

async-await

rxjs

angular-promise

angular

angular6