map is not a function (Rxjs) though import

Question

there were a lot of questions about "map is not a function", but almost everyone just did not imported the rxjs library.

In my case, I do the import, but the error is still there.

I work with Ionic 2 and this is how my package.json dependencies look like:

"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/compiler-cli": "0.6.2",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/platform-server": "2.0.0",
"@ionic/storage": "1.0.3",
"ionic-angular": "2.0.0-rc.1",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"rxjs": "5.0.0-beta.12"
}  

So that is how I create my service:

import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions, Response } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';

@Injectable()
export class LoginService {
    constructor(private http: Http) {

    }

    private dataUrl = '/node';

    getData() : any {
        this.http.get(this.dataUrl)
            .map(response => response.json())
            .subscribe(result => console.log(result));
    }
}

I also tried to reinstall the rxjs module, but still no success. Maybe it is incompatible with ionic 2 or the current angular version?

What do u think guys?

Cheers,

Andrej

Answer 1

This is 2018. I was having this same issue. This is what worked for me:

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

this.http.get(url)
.pipe(map(r => r.json()))
.subscribe(resp => {
  resp = resp.json();
  console.log(resp);
});