Search code examples
angularobservableangular5angular-httpclientangular-observable

Angular 5 Get correct Observable type from http request (why is it always Observable<Object>?)


I'm having a little trouble getting the correct observable type from an http.get request. Here is the function I'm having trouble on:

getMovie(title:string, year:number): Observable<Movie> {
    const params = new HttpParams()
        .set('title', title)
        .set('year', year.toString());
    return this.http.get(this.moviePath, {params})
  }

As you can see I want to receive and Observable of the class Movie from my backend api using the parameters 'title' and 'year'. The problem is that the reponse always comes back with the type Observable<Object> and not Observable<Movie>.

I'm aware that I could create a new Movie instance giving it the properties recieved from the list. The problem with that is that my movie class has properties that are optional. Here is my movie class:

export class Movie {
  title:string;
  year?:number;
  imdb?:string;
  trailer?:string;
  reviewClip?:string;
  reviewSummary?:string;
  reviewScore:number;
  createdAt?:Date;
  bestWeek:boolean;
  bestMonth:boolean;
}

Does anybody know an easy way to get the response to be of the type Observable<Movie> instead of Observable<Object>


Solution

  • May be you can try to typecast from json response.

    An example

    public getEmployees(): Observable<IEmployee[]> {  
            return this.http.get(this._repositoryURL)  
                .map((response: Response) =>
    
       { return <IEmployee[]>response.json() })  
                .catch(this.handleError);  
     }  
    

    Your code

    getMovie(title:string, year:number): Observable<Movie> {
        const params = new HttpParams()
            .set('title', title)
            .set('year', year.toString());
        return this.http.get(this.moviePath, {params}).map((response: Response) => { return <Movie>response.json() })  
                    .catch(this.handleError);
     }
    
     private handleError(errorResponse: Response) {  
            console.log(errorResponse.statusText);  
            return Observable.throw(errorResponse.json().error || "Server error");  
     }