web-dev-qa-db-fra.com

Comment trouver un élément d'un tableau par id avec Observable dans Angular2

J'ai décidé d'utiliser Observable au lieu des promesses Http.

Voilà à quoi ressemblait mon service Promise:

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));

    }

}

D'abord, je récupère un tableau de films, puis je trouve un certain film du tableau par id. Cependant, lorsque j'essaie de faire de même avec Observable, je reçois une notification d'erreur sur find: la propriété 'find' n'existe pas sur le type 'Movie []'.

Voici ce que j'ai essayé avec le service Observable:

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));
    }
}

Comment puis-je obtenir les mêmes fonctionnalités dans mon service Observable comme dans mon service Promise?

angulartypescriptrxjsobservable
11
GaborH

Je suppose que vous devez utiliser la méthode map au lieu de subscribe qui retourne l'objet Subscription

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));
  }
}

Exemple Plunker

17
yurzui