import .of() for Observable in typescript

alvipeo picture alvipeo · Nov 13, 2016 · Viewed 23.6k times · Source

I'm using this great repo for my angular 2 test project (TypeScript) - https://github.com/qdouble/angular-webpack2-starter. And I need to use Observable.of(..). When I try to import it:

import { Observable } from "rxjs/Observable";
import { of } from 'rxjs/observable/of';

I get:

Property 'of' does not exist on type 'typeof Observable'.

I also tried it the following way:

import { Observable } from "rxjs/Observable";
import { of } from 'rxjs/add/observable/of'; // notice 'add'

I got:

node_modules/rxjs/add/observable/of"' has no exported member 'of'.

So, how can one import this Of() static method for Observable???

Answer

Noémi Salaün picture Noémi Salaün · Nov 13, 2016

You do not have to import {of} from 'rxjs/add/observable/of'. You can directly use

import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/of";

Or you can import Observable from "rxjs/Rx" which bundle all the operators. Bad practice

import { Observable } from "rxjs/Rx";

Update 2018-01-26: RxJS v5.5+ pipeable operators

From https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

Starting in version 5.5 we have shipped "pipeable operators", which can be accessed in rxjs/operators (notice the pluralized "operators"). These are meant to be a better approach for pulling in just the operators you need than the "patch" operators found in rxjs/add/operator/*.

Now that "patching" imports are going to be deprecated, it would be better to use strict imports.

import { of as observableOf } from 'rxjs/observable/of'

and use it like that

const myObs$: Observable<number> = observableOf(1, 2, 3)