angular - Casting a type (interface) via map to observable

Question

I've been learning TypeScript with Angular. And currently I stuck as this moment. Previously I used subscribed method and everything works flawlessly, but not I decided to rewrite the code using async pipe and it just does't work....

1. RestAPI retursn requests in particular format

export interface responseFormat {
  success: boolean;
  data: any;
}

Answer 1

Why not directly return an Observable<restaurant> from your service?

getRestaurant(): Observable<restaurant> {
  return this.http.get<responseFormat>(environment.api + "/restaurant")
    .map((response: responseFormat) => response.data as restaurant);
}

Then on component side:

getRestaurant() {
  this.restaurantProvider.getRestaurant().subscribe((res: restaurant) => {
    this.restaurant = res;
  });
}

The error handling (success flag, HTTP errors, etc) could be handled via an HTTP Interceptor.