@bmm6o The new Http service returns an observable
– BroccoDec 29 '15 at 16:39

1

I ran into a nearly identical issue, trying to migrate a project from Angular2 beta-17 to final release. The issue for me was my IDE though, using VS 2015, Update 3. The TypeScript language service extension was still at 1.8.36, whereas as the ng2 quickstart guide (as I write this) is using "typescript": "^2.0.2". Upgrading the TS lang. service via Extensions and Updates did the trick for me. While that update was being installed I came across this SO answer, which ends with the same conclusion.
– Eric LeaseSep 21 '16 at 7:03

For phpstorm/webstorm, updating the typescript version with the library of my project also solved the problem. I followed the steps of this SO answer: stackoverflow.com/a/31608934/1291428
– SebasDec 11 '16 at 15:20

Please don't use 'import 'rxjs/Rx';' because it imports everything and rxjs tends to be pretty big. Import operators one by one as you need them.
– Drag0Sep 22 '16 at 13:56

1

Angular 2 with rxjs: 5.0.0-beta.12 here. And I still had to import 'rxjs/add/operator/do'... While we don't have to do this for .map() anymore. But this helped my .do() case, to realize I specifically need to import it. Thank you! One up vote from me :)
– MrCroftSep 25 '16 at 17:56

The RxJS library is quite large. Size matters when we build a production application and deploy it to mobile devices. We should include only those features that we actually need.

Accordingly, Angular exposes a stripped down version of Observable in the rxjs/Observable module, a version that lacks almost all operators including the ones we'd like to use here such as the map method.

It's up to us to add the operators we need. We could add each operator, one-by-one, until we had a custom Observable implementation tuned precisely to our requirements.

So as @Thierry already answered, we can just pull in the operators we need:

import 'rxjs/Rx'; wow. and all my hair pulling instantly goes away. i can't believe this isn't printed all over the world for Rxjs/Angular2. thanks!!!
– JimBMar 23 '16 at 16:59

But it frequently won't lint, by default it's a blacklisted import. Create a new angular CLI project, you'll see. I love the convenience myself but the convention in the places I work in NYC is not to do it.
– Tim ConsolazioApr 20 '18 at 13:54

Is there any advantage in this approach? Looks really interesting.
– MachadoMar 21 '18 at 20:48

Using this approach,now in your build it will only include used operators ( map in this case), earlier it was including all the operators from rxjs library. check below link for more detail. loiane.com/2017/08/angular-rxjs-imports
– Hiren ShahJun 15 '18 at 5:44

This isn't a very efficient approach. For instance if there are multiple subscribers they will each have to run map on the data, rather than just doing it once in the service. I think OP had the right approach, just didn't have the right module loaded to use it.
– Evan PlaiceJan 25 '16 at 18:17

When we use this approach map operator will be patched to observable.prototype and becomes a part of this object.

If later on, you decide to remove map operator from the code that handles the observable stream but fail to remove the corresponding import statement, the code that implements map remains a part of the Observable.prototype.

When the bundlers tries to eliminate the unused code (a.k.a.tree shaking), they may decide to keep the code of the map operator in the Observable even though it’s not being used in the application.

Solution - Pipeable operators

Pipeable operators are pure functions and do not patch the Observable. You can import operators using the ES6 import syntax import { map } from "rxjs/operators" and then wrap them into a function pipe() that takes a variable number of parameters, i.e. chainable operators.

For Angular versions 5 and above, the updated importing line looks like :

import { map } from 'rxjs/operators';

OR

import { map } from 'rxjs/operators';

Also these versions totally supports Pipable Operators so you can easily use .pipe() and .subscribe().

If you are using Angular version 2, then the following line should work absolutely fine :

import 'rxjs/add/operator/map';

OR

import 'rxjs/add/operators/map';

If you still encounter a problem then you must go with :

import 'rxjs/Rx';

I won't prefer you to use it directly bcoz it boosts the Load time, as it has a large number of operators in it (useful and un-useful ones) which is not a good practice according to the industry norms, so make sure you try using the above mentioned importing lines first, and if that not works then you should go for rxjs/Rx

as we all know angular is being developed every day so there are lots of changes every day and this solution is for angular 6 and rxjs 6
first to work with http yo should import it from :
after all you have to declare the HttpModule in app.module.ts

Since Http service in angular2 returns an Observable type,
From your Angular2 installation directory('node_modules' in my case),We need to import map function of the Observable in your component using http service,as:

The map you using here, is not the .map() in javascript, it's Rxjs map function which working on Observables in Angular...

So in that case you need to import it if you'd like to use map on the result data...

map(project: function(value: T, index: number): R, thisArg: any):
Observable<R> Applies a given project function to each value emitted
by the source Observable, and emits the resulting values as an
Observable.

this is happening because you are using the rxjs and in rxjs function are not static which means you can't call them directly you have to call the methods inside the pipe and import that function from the rxjs library

But if you are using rxjs-compat then you just need to import the rxjs-compat operators