How do I resolve an Angular/rxjs/observable error?

Question

ref: Angular, Observable, rxjx 6.4.0

My code reads:

import { Observable } from 'rxjs';
import 'rxjs/add/observable/of';
...
return Observable.of(this.products);
...

The error reads:

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

I can also remove the /add from the import since of.js exists on both folders. But this returns the same error.

Have you read the guidance on upgrading to RxJS 6? E.g. https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md — jonrsharpe, Mar 18 '20 at 22:04
The imports changed for RxJS v6. They are now: `from 'rxjs'` for an objects and creation functions and `from 'rxjs/operators'` for the operators. See this for more information: https://rxjs.dev/guide/v6/migration — DeborahK, Mar 18 '20 at 22:05
Does this answer your question? [Property 'of' does not exist on type 'typeof Observable](https://stackoverflow.com/questions/38067580/property-of-does-not-exist-on-type-typeof-observable) — John Montgomery, Mar 18 '20 at 22:06

score 0 · Answer 1 · answered Mar 18 '20 at 22:08

0

Your code should look like:

 import { Observable, of } from 'rxjs'

 return of(this.products);

answered Mar 18 '20 at 22:08

bryan60

28,215
4
48
65

score 0 · Answer 2 · answered Mar 18 '20 at 22:10

As others have pointed out, with that version of RxJs the static methods and operators are imported differently.

Here is an example from their docs:

import { of } from 'rxjs';

of(10, 20, 30)
.subscribe(
  next => console.log('next:', next),
  err => console.log('error:', err),
  () => console.log('the end'),
);
// result:
// 'next: 10'
// 'next: 20'
// 'next: 30'

So your code would look like:

import { of } from 'rxjs';

...
return of(this.products);
...

How do I resolve an Angular/rxjs/observable error?

2 Answers2