Could not use Observable.of in RxJs 6 and Angular 6

Question

 import { Observable, of } from "rxjs";

// And if I try to return like this
  return Observable.of(this.purposes);

I am getting an error stating, Property 'of' does not exist on type 'typeof Observable'

where is this documented? The typical line is "You pull in any operator you need from one spot, under 'rxjs/operators' " which is obviously different from creation, but it's not clear the static method has been replaced. This import knowledge being scattered across the galaxy like I'm looking for the Tox Uthat is just lost time. — Joe, May 08 '18 at 18:06

score 120 · Accepted Answer · answered May 09 '18 at 04:36

120

Looks like cartant's comment is correct, the RxJS upgrade guide doesn't cover that method specifically but does say "Classes that operate on observables have been replaced by functions"

Which seems to mean all or most of those class methods like .of, .throw etc. have been replaced by a function

So instead of

import { Observable, of } from "rxjs";
Observable.of(this.purposes);

do

import { of } from "rxjs";
of(this.purposes);

answered May 09 '18 at 04:36

tim545

1,523
1
11
12

7

import { of } from 'rxjs/observable/of'; – sabithpocker Jun 14 '18 at 14:23
1

What about `reduce()`? – Marinos An Jun 26 '18 at 18:58
reduce() has been moved to the operators so you can import it using `import {reduce} from 'rxjs/operators';` – tim545 Jul 18 '18 at 01:09
6

This is such an awful change. These methods should be static methods on a class like they were before. Name collisions are much more likely now. – Trevor de Koekkoek Oct 12 '18 at 22:15
You can have an overview of changes https://www.academind.com/learn/javascript/rxjs-6-what-changed/ – Inês Gomes Feb 21 '19 at 10:02
of is now deprecated, documentation advises to use scheduled instead – Wildhammer May 01 '19 at 01:20

score 4 · Answer 2 · answered May 24 '18 at 10:49

rxjs 6

import { PreloadingStrategy, Route } from '@angular/router';
import { Observable, of } from 'rxjs';

export class SelectivePreloadingStrategy implements PreloadingStrategy {
    preload(route: Route, load: Function): Observable<any> {
       return route.data && route.data.preload === false ? of(null) : load();
    }

 }

score 0 · Answer 3 · answered May 13 '19 at 17:05

0

To avoid black-list linting of the rxjs, import them like this:

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

answered May 13 '19 at 17:05

Tito Leiva

892
1
12
29

Could not use Observable.of in RxJs 6 and Angular 6

3 Answers3

Linked

Related