web-dev-qa-db-ja.com

結果からObservable <T>を作成します

私はAngular2を試しています。

HttpサービスがObservableの代わりにPromiseオブジェクトを使用していることに気付きました（その選択はあまり好きではありません。async/awaitが到着しています）。

私のサービスでは、PlantsのリストをWebサービスからダウンロードします。プラントをクリックすると、ルーティングを使用して詳細が表示されます。しかし、この方法で戻ると、コンストラクターが再度呼び出されるため、植物が再びダウンロードされます。

これを避けるために、次のようなことをしたいです。

public getPlants(): Observable<Plants[]>
{   
    if (this._plants != null)
        return Observable.fromResult (this._plants); //This method does not exists 

    return this._http.get('../../res/heroes.json')...
}

それを行う方法はありますか？ tsファイルにObservableクラスをインポートするにはどうすればよいですか？

ありがとう！

typescriptangularobservablerxjs
30
user3471528

TypeScript（またはJavaScript）のメソッドは of と呼ばれます。 rxjsには素敵なチュートリアルもあります

rxjs6を使用している場合、rxjsからすべてを取得します。

import { Observable, of } from 'rxjs';

public getPlants(): Observable<Plant[]> {
  const mocked: Plant[] = [
    { id: 1, image: 'hello.png' }
  ];
  // returns an Observable that emits one value, mocked; which in this case is an array,
  // and then a complete notification
  // You can easily just add more arguments to emit a list of values instead
  return of(mocked);
}

以前のバージョンでは、異なる場所から演算子をインポートしました

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

public getPlants(): Observable<Plant[]> {
  const mocked: Plant[] = [
    { id: 1, image: 'hello.png' }
  ];
  return of(mocked);
}

そしてその前に、それをObservableクラスの拡張としてインポートしました

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

public getPlants(): Observable<Plants[]> {
    // this can be changed to a member variable of course
    let mocked: Plants[] = [{
        id: 1,
        image: "hello.png"
    }];
    return Observable.of(mocked);
}
44
Patrick

これは私の作業ソリューションです：

if (this._heroes != null && this._heroes !== undefined) {
    return Observable.create(observer => {
        observer.next(this._heroes);
        observer.complete();
    });
}

これが最善の解決策であることを願っています。

26
user3471528