Наблюдаемая функция не является функцией

Ответ 1

На самом деле у меня импорт перепутался. В последней версии RxJS мы можем импортировать ее так:

import 'rxjs/add/observable/of';

Ответ 2

Если у кого-то возникла эта проблема при использовании Angular 6/rxjs 6, посмотрите ответы здесь: Не удалось использовать Observable.of в RxJs 6 и Angular 6

Короче, вам нужно импортировать его так:

import { of } from 'rxjs';

А потом вместо звонка

Observable.of(res);

просто используйте

of(res);

Ответ 3

Хотя это звучит совершенно странно, для меня важно было использовать "O" в пути импорта import {Observable} from 'rxjs/Observable. Сообщение об ошибке с observable_1.Observable.of is not a function остается присутствующим, если я импортирую Observable из rxjs/observable. Странно, но я надеюсь, что это поможет другим.

Ответ 4

Моя глупая ошибка заключалась в том, что я забыл добавить /add, требуя наблюдаемого.

Было:

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

Что визуально выглядит ОК, потому что файл rxjs/observable/of, по сути, существует.

Должно быть:

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

Ответ 5

Просто добавьте,

если вы используете многие из них, вы можете импортировать все, используя

import 'rxjs/Rx'; 

как упоминалось Tempier @Thierry. Но я думаю, что если вы используете ограниченный оператор, вам следует импортировать отдельный оператор, например

import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/observable/of';

как указано @uksz.

Потому что 'rxjs/Rx' импортирует все компоненты Rx, которые, безусловно, оценивают производительность.

Ответ 6

Patching не работал у меня по какой-то причине, поэтому мне пришлось прибегнуть к этому методу:

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

// ...

return of(res)

Ответ 7

Вы также можете импортировать все операторы следующим образом:

import {Observable} from 'rxjs/Rx';

Ответ 8

// "rxjs": "^5.5.10"
import { of } from 'rxjs/observable/of';

.... 
return of(res)

Ответ 9

Обновлен с Angular 5/Rxjs 5 до Angular 6/Rxjs 6?

Вы должны изменить свой импорт и свою реализацию. Проверьте сообщение в блоге Дэмиена

TL;DR:

import { Observable, fromEvent, of } from 'rxjs';

const yourResult = Observable
    .create(of(yourObservable))
    .startWith(null)
    .map(x => x.someStringProperty.toLowerCase());

//subscribe to keyup event on input element
Observable
    .create(fromEvent(yourInputElement, 'keyup'))
    .debounceTime(5000)
    .distinctUntilChanged()
    .subscribe((event) => {
        yourEventHandler(event);
    });

Ответ 10

Я использую Angular 5.2 и RxJS 5.5.6

Этот код не работал:

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

     getHeroes(): Observable<Hero[]> {
        return of(Hero[]) HEROES;

      }

Ниже работает код:

    import { Observable } from 'rxjs/Observable';
    import { Subscriber } from 'rxjs/Subscriber';

     getHeroes(): Observable<Hero[]> 
     {
          return Observable.create((observer: Subscriber<any>) => {
              observer.next(HEROES);
              observer.complete();
          });

      }

Метод вызова:

this.heroService.getHeroes()
      .subscribe(heroes => this.heroes = heroes);

Я думаю, что они могли бы переместить/изменить функциональность() в RxJS 5.5.2

Ответ 11

Это должно работать правильно, просто попробуйте.

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

Ответ 12

У меня была эта проблема сегодня. Я использую systemjs для загрузки зависимостей.

Я загружал Rxjs следующим образом:

...
    paths: {
        "rxjs/*": "node_modules/rxjs/bundles/Rx.umd.min.js"
    },
...

Вместо использования путей используйте это:

var map = {
...
'rxjs':                       'node_modules/rxjs',
...
}

var packages = {
...
'rxjs': { main: 'bundles/Rx.umd.min.js', defaultExtension: 'js' }
...
}

Это небольшое изменение в способе, которым система загружает библиотеку, исправила мою проблему.

Ответ 13

Для угловых 5+:

import { Observable } from 'rxjs/Observable'; должно сработать. Пакет наблюдателя должен соответствовать импорту, а также import { Observer } from 'rxjs/Observer'; если вы используете наблюдателей, это

import {<something>} from 'rxjs'; делает огромный импорт, так что лучше его избежать.

Ответ 14

RxJS 6

При обновлении до версии 6 библиотеки RxJS и без использования rxjs-compat следующий код

import 'rxjs/add/observable/of';   
  // ...
  return Observable.of(res);

должен быть изменен на

import { of } from 'rxjs';
  // ...
  return of(res);

Ответ 15

import 'rxjs/add/observable/of';

показывает требование rxjs-compat

require("rxjs-compat/add/observable/of");

У меня не было этого установлено. Установлено

npm install rxjs-compat --save-dev

и повторный запуск исправил мою проблему.

Ответ 16

В rxjs v6, of оператора должен быть импортирован как import { of } from 'rxjs';

Ответ 17

Каким-то образом даже Webstorm сделал такой import {of} from 'rxjs/observable/of'; и все начало работать

Ответ 18

Для меня (Angular 5 & RxJS 5) импорт автозаполнения предложил:
import { Observable } from '../../../../../node_modules/rxjs/Observable';
в то время как должно быть (со всеми статическими операторами from, of, ect работает нормально:
import { Observable } from 'rxjs/Observable';

Ответ 19

Если вы используете Angular 6/7

import { of } from 'rxjs';

А потом вместо звонка

Observable.of(res);

просто используйте

of(res);