Search code examples
angularangular5rxjs5

angular 5, RxJs { map } import doesn't work or i'm missing something?


I'm trying to map the result of my httpclient and we need to use the new import for RxJs to get the treeshaking working.

so i've found 2 map but none work...

import { map } from 'rxjs/operator/map'; 
import { map } from 'rxjs/operators/map';

the old fashion way that we need to remove

import 'rxjs/add/operator/map';

Here is the code i need to get to work!

  getValues(): Observable<Value[]> {   
    return this.http.get<Response<Values>>(this.url).map(reponse => {
      return reponse.data.values;
    });
  }

but the .map is not known for the observable,


Solution

  • The proper "modern" way to import RxJS operators is:

    import { map } from 'rxjs/operators';
    

    Along with the use of pipeable operators.

    Your code becomes:

    getValues(): Observable<Value[]> {   
      return this.http.get<Response<Values>>(this.url).pipe(
        map(reponse => reponse.data.values)
      );
    }