How to find an element of an array by id with Observable in Angular2

Question

I decided to use Observable instead of Http promises.

That is how my Promise service looked:

export class MovieService {      movies: Movie[]     movie: Movie;     constructor(private http:Http) { }     getMovies(): Promise<Movie[]>{          return this.http.get('http://api.request.com')             .toPromise()             .then((res:Response) => res.json()['results'])      }     getMovie(id: number): Promise<Movie> {         return this.getMovies()             .then(movies => movies.find(movie => movie.id == id));      }  } 

First I fetch an array of movies, and than I find a certain movie of the array by id. However when I try to do the same with Observable, I get an error notification on find: Property 'find' does not exist on type 'Movie[]'.

Here is what I tried with the Observable service:

export class MovieService {      movies: Movie[];     movie: Movie;      constructor(private http: Http) {     }      getMovies(): Observable<Movie[]> {          return this.http.get('http://api.request.com)             .map((res: Response) => res.json()['results']);     }      getMovie(id: number): Observable<Movie> {         return this.getMovies()             .subscribe(movies => movies.find(movie => movie.id == id));     } } 

How can I achieve the same functionality in my Observable service just like in my Promise service?

Answer 1

I suppose you should use map method instead of subscribe which returns Subscription object

export class MovieService {   movies: Movie[];   movie: Movie;    constructor(private http: Http) {}    getMovies(): Observable<Movie[]> {     return this.http.get('http://api.request.com')       .map((res: Response) => res.json()['results']);   }    getMovie(id: number): Observable<Movie> {     return this.getMovies()       .map(movies => movies.find(movie => movie.id == id));   } } 

Plunker Example