-1

In my Angular 4 app I'm trying to get some data from an API. I'm using this article which explains how to do that, but I'm getting an exception:

TypeError: this.http.get(...).map is not a function

This is my code:

import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { Person } from '../../../interfaces/Person';
import {configuration} from "../config";

@Injectable()
export class AdsService{
  private baseUrl: string = configuration.serverUrl;

  constructor(private http : Http){
  }

  getAll(): Observable<Person[]>{
    let people$ = this.http
      .get(`${this.baseUrl}/people`, {headers: this.getHeaders()})
      .map(mapPeople);

    return people$;
  }
}

function mapPeople(response:Response): Person[]{
  return response.json().results;
}

Any help will be profoundly appreciated!

Alon
  • 10,381
  • 23
  • 88
  • 152
  • 2
    Possible duplicate of [Angular 2 HTTP GET with TypeScript error http.get(...).map is not a function in \[null\]](https://stackoverflow.com/questions/34515173/angular-2-http-get-with-typescript-error-http-get-map-is-not-a-function-in) – AT82 May 23 '17 at 10:17

2 Answers2

2

I dont see the map method imported.

Add this to your imports

import rxjs/add/operator/map

Parth Ghiya
  • 6,929
  • 2
  • 30
  • 37
0

You must import map in this file, for that you just need to add the following line:

import 'rxjs/add/operator/map';

OR 

import 'rxjs/add/operators/map';

Also, if you are using Angular 5 or above, then the above imports have been sorted to :

import { map } from 'rxjs/operator';

OR

import { map } from 'rxjs/operators';

Add this and Enjoy !!! :-)

Jitendra Ahuja
  • 749
  • 3
  • 9
  • 22