web-dev-qa-db-ja.com

Observable.ofは関数ではありません

私のプロジェクトでObservable.of関数をインポートするのに問題があります。私のIntellijはすべてを見ています。私のコードでは、私は持っています:

import {Observable} from 'rxjs/Observable';

私のコードでは、このように使用しています。

return Observable.of(res);

何か案は?

154
uksz

実際、輸入品がめちゃくちゃになっています。 RxJSの最新バージョンでは、次のようにインポートできます。

import 'rxjs/add/observable/of';
218
uksz

Angular 6/rxjs 6を使用中に誰かがこの問題を抱えている場合は、こちらの回答を参照してください。 RxJs 6およびAngular 6ではObservable.ofは使用できません

一言で言えば、あなたはこのようにそれをインポートする必要があります:

import { of } from 'rxjs';

そして電話する代わりに

Observable.of(res);

ただ使う

of(res);
116
jgosar

それは絶対に奇妙に聞こえますが、私と一緒にimport {Observable} from 'rxjs/Observableのインポートパスで 'O'を大文字にすることは重要でした。 observable_1.Observable.of is not a functionからObservableをインポートした場合、rxjs/observableのエラーメッセージは表示されたままになります。奇妙だけど、それが他の人に役立つことを願っています.

41
Mark Langer

私の愚かな間違いは、私が観測量を要求するときに/addを追加するのを忘れたことです。

でした:

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

rxjs/observable/ofファイルが実際に存在するため、どちらが視覚的にも問題ないように見えます。

する必要があります。

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

加えて

あなたがそれらの多くを使用しているなら、あなたはすべてを使ってインポートすることができます

import 'rxjs/Rx'; 

@Thierry Templierで述べたように。しかし、私はあなたが限られた演算子を使用しているならばあなたはそれからあなたが個々の演算子を輸入するべきであると思う

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

@ukszが述べたように。

なぜなら 'rxjs/Rx'は間違いなくパフォーマンスを犠牲にするすべてのRxコンポーネントをインポートするからです。

Comparison

18

何らかの理由でパッチが私には効かなかったので、私はこの方法に頼らなければなりませんでした:

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

// ...

return of(res)
17
Shaun Grady

この方法ですべての演算子をインポートすることもできます。

import {Observable} from 'rxjs/Rx';
17

Angular 6/7を使用している場合

import { of } from 'rxjs';

そして電話する代わりに

Observable.of(res);

ただ使う

of(res);
12
Akitha_MJ

Angular 5.2およびRxJS 5.5.6を使用しています

このコードは しない work:

     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の()機能を移動/変更した可能性があると思います

4

Angular 5/Rxjs 5からAngular 6/Rxjs 6にアップグレードしましたか。

インポートとインスタンス化を変更しなければなりません。 Damienのブログ投稿をチェックする

T1; 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);
    });
4
KVarmark
// "rxjs": "^5.5.10"
import { of } from 'rxjs/observable/of';

.... 
return of(res)
4
letanthang

これは正しく動作するはずです。

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

Angular 5+の場合:

import { Observable } from 'rxjs/Observable';は動作するはずです。次のようなオブザーバを使用している場合、オブザーバパッケージはインポートとimport { Observer } from 'rxjs/Observer';も一致する必要があります。

import {<something>} from 'rxjs';は巨大なインポートを行うので、それを避けるのが良いです。

2
SS-

RxJS 6

RxJSライブラリをバージョン6にアップグレードし、rxjs-compatパッケージを使用しない場合、次のコード

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

に変更する必要があります

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

私は今日この問題を抱えていました。私は依存関係をロードするためにsystemjsを使っています。

私はこのようにRxjをロードしていました:

...
    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' }
...
}

Systemjsがライブラリをロードする方法のこの小さな変更は私の問題を解決しました。

2
Eli

私にとって(Angular 5およびRxJS 5)、オートコンプリートインポートは次のように示唆しています。

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

するべきである間(すべての静的演算子fromof、e.c.tはうまく働きますが:

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

rxjs-compatの要件を示しています

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

私はこれをインストールしていませんでした。によってインストールされています

npm install rxjs-compat --save-dev

そして再実行すると私の問題は解決しました。

1
Esaith

rxjs v6では、of演算子はimport { of } from 'rxjs';としてインポートされるべきです

1

どういうわけかWebstormでさえそれをこのimport {of} from 'rxjs/observable/of';のようにし、そしてすべてが機能し始めた

0
Yevheniy Potupa