Observable.of não é uma função

Estou tendo problemas com a Observable.offunção de importação no meu projeto. Meu Intellij vê tudo. No meu código eu tenho:

import {Observable} from 'rxjs/Observable';

e no meu código eu uso assim:

return Observable.of(res);

Alguma ideia?

Na verdade eu tenho importações desarrumadas. Na versão mais recente do RxJS, podemos importá-lo assim:

import 'rxjs/add/observable/of';

Se alguém tiver esse problema ao usar o Angular 6 / rxjs 6, veja as respostas aqui: Não foi possível usar o Observable.of nos RxJs 6 e Angular 6

Em suma, você precisa importá-lo assim:

import { of } from 'rxjs';

E então, em vez de ligar

Observable.of(res);

Apenas use

of(res);

Embora pareça absolutamente estranho, comigo importava capitalizar o 'O' no caminho de importação de import {Observable} from 'rxjs/Observable. A mensagem de erro observable_1.Observable.of is not a functionpermanece presente se eu importar o Observable de rxjs/observable. Estranho, mas espero que ajude os outros.

Se você estiver usando Angular 6/7

import { of } from 'rxjs';

E então, em vez de ligar

Observable.of(res);

Apenas use

of(res);

Meu erro bobo foi que eu esqueci de acrescentar /addao exigir o observável.

Foi:

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

Que visualmente parece OK, porque o rxjs/observable/ofarquivo existe.

Deveria estar:

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

O patch não estava funcionando para mim, por qualquer motivo, então tive que recorrer a este método:

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

// ...

return of(res)

Só para adicionar,

se você estiver usando muitos deles, poderá importar todos os

import 'rxjs/Rx'; 

como mencionado por @Thierry Templier. Mas acho que se você estiver usando um operador limitado, deverá importar um operador individual como

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

como mencionado por @uksz.

Porque 'rxjs / Rx' importará todos os componentes do Rx que definitivamente custam desempenho.

Você também pode importar todos os operadores desta maneira:

import {Observable} from 'rxjs/Rx';

Estou usando Angular 5.2 e RxJS 5.5.6

Este código não funcionou:

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

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

      }

Abaixo o código funcionou:

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

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

      }

Método de chamada:

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

Eu acho que eles podem ter mudado / alterado a funcionalidade () no RxJS 5.5.2

Isso deve funcionar corretamente, apenas tente.

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

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

.... 
return of(res)

Atualizou de Angular 5 / Rxjs 5 para Angular 6 / Rxjs 6?

Você deve alterar suas importações e sua instanciação. Confira o post de Damien

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);
    });

RxJS 6

Ao atualizar para a versão 6 da RxJSbiblioteca e não usar o rxjs-compatpacote, o código a seguir

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

tem que ser transformado em

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

Eu tive esse problema hoje. Estou usando o systemjs para carregar as dependências.

Eu estava carregando os Rxjs assim:

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

Em vez de usar caminhos, use o seguinte:

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

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

Essa pequena alteração na maneira como o systemjs carrega a biblioteca corrigiu meu problema.

Para Angular 5+:

import { Observable } from 'rxjs/Observable';Deveria trabalhar. O pacote observador também deve corresponder à importação import { Observer } from 'rxjs/Observer';se você estiver usando observadores

import {<something>} from 'rxjs'; faz uma importação enorme, por isso é melhor evitá-la.

Para mim (Angular 5 e RxJS 5), a importação do preenchimento automático sugeriu:

import { Observable } from '../../../../../node_modules/rxjs/Observable';

enquanto a deve ser (com todos os operadores estáticos from, of, ect funcionando bem:

import { Observable } from 'rxjs/Observable';

import 'rxjs/add/observable/of';

mostra um requisito de rxjs-compat

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

Eu não tinha isso instalado. Instalado por

npm install rxjs-compat --save-dev

e executar novamente corrigiu meu problema.

Na rxjsv6, o ofoperador deve ser importado comoimport { of } from 'rxjs';

De alguma forma, até o Webstorm fez assim import {of} from 'rxjs/observable/of'; e tudo começou a funcionar