Search code examples
httpxmlhttprequestangular

Error : .map() is not a function

Trying to subscribe to the parsed response of HTTP - GET from the component. Getting a error saying .map is not a function whether used from HTTPService or from the component class.

Httpdemo.getResponse().map(res => res.json()).subscribe((cities)=>{ 
   this.cities = cities.cities;          
   console.log(this.cities);
});

But the following works:

Httpdemo.getResponse().subscribe((cities)=>{ 
    this.cities = JSON.parse(cities._body).cities;          
    console.log(this.cities);
});

The parsing also does not work in the Httpdemo service. 

return this.http.get('./app/cities.json').map(res => res.json())

What is wrong with the usage here in my code?

Solution

  • You need to import the map operator for Observable as described below:

    import 'rxjs/add/operator/map';

    By default not all operators are included.

    See this answer for more details: