Angular - rxjs_Observable__WEBPACK_IMPORTED_MODULE_2__.Observable.of is not a function

Question

import { Injectable } from '@angular/core';
import 'rxjs/add/observable/of';
import { Observable } from 'rxjs/Observable';
import { AppSettings } from "./appsettings";
@Injectable()
export class AppSettingsService {
    getSettings(): Observable<AppSettings> {
        let settings = new AppSettings();
        return Observable.of<AppSettings>(settings);
    }
}

above is my angular5 code but i'm facing issue . please see the console error image .

in your `package.json` you will find a line like this: `"rxjs": "5.5.6"` under section `dependencies` — Jacopo Sciampi, Oct 11 '18 at 07:49
maybe this will help you: https://stackoverflow.com/questions/36568388/observable-of-is-not-a-function Anyway you could try to do something like `return of(settings)` or `return of(settings as AppSettings)` — Jacopo Sciampi, Oct 11 '18 at 07:56

score 1 · Accepted Answer · answered Oct 11 '18 at 08:45

The error is because from version 6 onwards, the package structure of rxjs has changed. The below code works for Angular 6:

import { Injectable } from '@angular/core';
import { Observable , of} from 'rxjs';
import { AppSettings } from "./appsettings";

@Injectable({
  providedIn: 'root'
})
export class AppSettingsService {
    getSettings(): Observable<AppSettings> {
        let settings = new AppSettings();
        return of<AppSettings>(settings);
    }
}

Angular - rxjs_Observable__WEBPACK_IMPORTED_MODULE_2__.Observable.of is not a function

1 Answers1