Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

import .of() for Observable in typescript

Tags:

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???

like image 643
alvipeo Avatar asked Nov 13 '16 22:11

alvipeo


People also ask

What is the use of Observable in TypeScript?

An Observable is a collection of multiple input values that get processed using array methods such as map , reduce , filter , and so on. It comes in handy when handling asynchronous operations such as making HTTP requests, user-input events, and so on.

What library do you import to use an Observable in Angular?

The RxJS library brings Reactive Programming into Angular. Using RxJs, we can create an observable, which can emit the next value, error, and complete signals to the subscriber of the observable.


1 Answers

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) 
like image 184
Noémi Salaün Avatar answered Sep 19 '22 00:09

Noémi Salaün