[Angular 2] Using Promise to Http

Posted 2020-07-06 Answer1215

You can also use Promise for http:

 

So for the service, you need to call toPromise() method:

  getVehicles(value?: string) {
    return this._http.get(‘api/vehicles.json‘)
      .map((response: Response) => <Vehicle[]>response.json().data)
      .toPromise()
      .catch(this.handleError);
  }

 

Then in your controller, you can get the Promise back:

  getHeroes(value?: string) {
    this.vehicles = this._vehicleService.getVehicles(value);
  }

But notice that, we assign the Promise to the this.vehices. so it means we use ‘async‘ pipe:

<ul>
  <li *ngFor="#vehicle of vehicles | async"
    (click)="select(vehicle)">
    {{ vehicle.name }}
  </li>
</ul>