Angular 2 Http异步等待

Question

我需要使用async/await 来调用http.get

我试过了 https://labs.encoded.io/2016/12/08/asyncawait-with-angular/

但是

async getPrice(currency: string): Promise<number> {
  const response = await this.http.get(this.currentPriceUrl).toPromise();
  return response.json().bpi[currency].rate;
}

toPromise()

给我一​​个错误:

[ts] Property 'toPromise' does not exist on type 'Observable'.

有什么解决办法吗？

Answer 1

几乎是来自 https://stackoverflow.com/a/41834083/1260204 的直接复制稍作编辑，重点放在 toPromise而不是 map .

---

RxJs图书馆有许多您可以使用的运算符，例如 toPromise , map , catch , do等，但为了使用它们，您必须引用它们包含在其中的文件/模块。

angular 站点上的教程很好地解释了如何使用 Observable<T>以及如何创建一个引用映射到您想要使用的更常见的方法，例如 toPromise在RxJs库。通过在 RxJs 中创建引用更常用的运算符和类型的单个文件库中，您只需在想要使用这些类型的地方引用该引用文件，这样就不必在您想要利用它们的项目中的每个文件中重新添加所有运算符/类型。

这里是一个示例文件(在本示例中名为 rxjs-operators.ts)，其中包含一些更常用的方法。

// Observable class extensions
import 'rxjs/add/observable/of';
import 'rxjs/add/observable/throw';

// Observable operators
import 'rxjs/add/operator/toPromise'; // <=== your missing extension 
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';

到您要使用的文件的顶部.toPromise (或任何其他方法)添加此行。

import './rxjs-operators';