http - Missing observable methods RxJS 5.0.0-beta.0

Question

I'm having a problem using RxJS with Angular 2. Most of methods suggested from Typescript definition file are not defined on my Observable object like...

then I figured out, that methods does not exists on the Observable prototype.

I know a lot of things changed from version 4 to 5,so do I miss something?

Browserify added it for me...

Answer 1

Without seeing your actual code, I can't tell you exactly what to add to fix it.

But the general problem is this: RxJS 5 is not included with Angular 2 any longer now that it has entered the Beta stage. You will need to import either the operator(s) you want, or import them all. The import statements looks like this:

import 'rxjs/add/operator/map'; // imports just map
import 'rxjs/add/operator/mergeMap'; // just mergeMap
import 'rxjs/add/operator/switchMap'; // just switchMap
import {delay} from 'rxjs/operator/delay'; // just delay

or like

import 'rxjs/Rx'; // import everything

To determine the path to your desired module, look at the source tree. Every import with add will add properties to Observable or Observable.prototype. Without add, you'd need to do import {foo} from 'rxjs/path/to/foo'.

You will also need to make sure that RxJS is being brought into the project correctly. Something like this would go into your index.html file:

System.config({
    map: {
        'rxjs': 'node_modules/rxjs' // this tells the app where to find the above import statement code
    },
    packages: {
        'app': {defaultExtension: 'js'}, // if your app in the `app` folder
        'rxjs': {defaultExtension: 'js'}
    }
});
System.import('app/app'); // main file is `app/app.ts` 

If you use Webpack to build the Angular 2 app like in this Github project (like I did), then you don't need that System stuff and the imports should do it.