Why is `this.http.get(...).map` not a function in my Angular HTTP GET request?

Angular HTTP GET with TypeScript Error: this.http.get(...).map is Not a Function

Overview

When attempting to perform an HTTP GET request with Angular, some developers encounter the following error: TypeError: this.http.get(...).map is not a function in [null]. This can be frustrating and halt application development.

Solution

The error is most likely due to missing RxJS operators. To resolve this, you need to import the necessary operator for the .map() method to your code.

Import the Appropriate Operator:

import 'rxjs/add/operator/map';

This will import only the .map() operator and add it to your application.

Alternative: Import All Operators (Caution)

If you prefer to have access to all 50 RxJS operators, you can import them all with the following statement, but be aware that this will increase your application's bundle size:

import 'rxjs/Rx';

Example Implementation

Here's an example implementation of the .map() operator in your TypeScript code:

getHalls() {
  return this.http.get(HallService.PATH + 'hall.json')
    .map((res: Response) => res.json());
}

Additional Notes

Refer to the following issue for further details and discussions on this topic:

• https://github.com/angular/angular2/issues/11564

The above is the detailed content of Why is `this.http.get(...).map` not a function in my Angular HTTP GET request?. For more information, please follow other related articles on the PHP Chinese website!