RxJS SubjectまたはObservableの現在の値を取得するにはどうすればよいですか？

Angular 2サービスがあります。

import {Storage} from './storage';
import {Injectable} from 'angular2/core';
import {Subject}    from 'rxjs/Subject';

@Injectable()
export class SessionStorage extends Storage {
  private _isLoggedInSource = new Subject<boolean>();
  isLoggedIn = this._isLoggedInSource.asObservable();
  constructor() {
    super('session');
  }
  setIsLoggedIn(value: boolean) {
    this.setItem('_isLoggedIn', value, () => {
      this._isLoggedInSource.next(value);
    });
  }
}

すべてがうまくいきます。しかし、サブスクライブする必要のない別のコンポーネントがあります。特定の時点でisLoggedInの現在の値を取得する必要があるだけです。これどうやってするの？

A SubjectまたはObservable現在の値を持っていません。値が発行されると、サブスクライバーに渡され、それが使用されますObservable。

現在の値が必要な場合BehaviorSubjectは、まさにその目的のために設計されたものを使用してください。BehaviorSubject最後に発行された値を保持し、すぐに新しいサブスクライバーに発行します。

また、メソッドがあります getValue()現在の値を取得ます。

あなたがすべき唯一の方法 観察可能/件名「外」の値を取得するには、購読しています！

使用しているgetValue()場合は、宣言的パラダイムで不可欠なことをしています。それは脱出ハッチとして存在しますが、使用するべきではない時間の99.9％getValue()。いくつか興味深い点がありますgetValue()でしょうが：被写体が解除されている場合は、エラーがスローされます、それはエラー状態ですので、被写体が死んでいる場合、それは価値を得ることからあなたを防ぐことができます、などしかしが、再び、それはエスケープとしてありますまれな状況のためのハッチ。

サブジェクトまたは監視可能オブジェクトから「Rx-y」の方法で最新の値を取得するには、いくつかの方法があります。

1. 使用BehaviorSubject：しかし、実際にそれをサブスクライブします。初めて購読するときBehaviorSubjectと、受信または初期化された前の値が同期的に送信されます。
2. ReplaySubject(N)：を使用すると、N値がキャッシュされ、新しいサブスクライバーに再生されます。
3. A.withLatestFrom(B)：この演算子を使用して、オブザーバブルがB発生したときにオブザーバブルから最新の値を取得しAます。両方の値を配列で提供します[a, b]。
4. A.combineLatest(B)：この演算子を使用して、またはからA、または発行するBたびに、最新の値を取得します。配列で両方の値を提供します。AB
5. shareReplay()：を通じて監視可能なマルチキャストを作成しReplaySubjectますが、エラー時に監視可能を再試行できます。（基本的には、promise-yキャッシュ動作を提供します）。
6. publishReplay()、publishBehavior(initialValue)、multicast(subject: BehaviorSubject | ReplaySubject)、など：その他の演算子レバレッジBehaviorSubjectとReplaySubject。同じことの異なるフレーバー、それらは基本的に、サブジェクトを通してすべての通知を集めることにより、オブザーバブルをソースにマルチキャストします。あなたconnect()は件名でソースを購読するために呼び出す必要があります。

同様の状況で、Subjectのサブスクライバーがその値が到着した後にサブジェクトをサブスクライブしました。

この場合、BehaviorSubjectに似たReplaySubjectがチャームのように機能することがわかりました。そして、より良い説明へのリンクがあります：http : //reactivex.io/rxjs/manual/overview.html#replaysubject

const observable = of('response')

function hasValue(value: any) {
  return value !== null && value !== undefined;
}

function getValue<T>(observable: Observable<T>): Promise<T> {
  return observable
    .pipe(
      filter(hasValue),
      first()
    )
    .toPromise();
}

const result = await getValue(observable)
// Do the logic with the result
// .................
// .................
// .................

それを実装する方法については、ここから記事全体を確認できます。 https://www.imkrish.com/how-to-get-current-value-of-observable-in-a-clean-way/

子コンポーネントで同じ問題が発生しましたが、最初はサブジェクトの現在の値を取得してから、サブジェクトをサブスクライブして変更をリッスンする必要があります。サービスの現在の値を維持するだけで、コンポーネントがアクセスできるようにします。例：

import {Storage} from './storage';
import {Injectable} from 'angular2/core';
import {Subject}    from 'rxjs/Subject';

@Injectable()
export class SessionStorage extends Storage {

  isLoggedIn: boolean;

  private _isLoggedInSource = new Subject<boolean>();
  isLoggedIn = this._isLoggedInSource.asObservable();
  constructor() {
    super('session');
    this.currIsLoggedIn = false;
  }
  setIsLoggedIn(value: boolean) {
    this.setItem('_isLoggedIn', value, () => {
      this._isLoggedInSource.next(value);
    });
    this.isLoggedIn = value;
  }
}

現在の値を必要とするコンポーネントは、サービスからそれにアクセスすることができます。つまり、

sessionStorage.isLoggedIn

これが正しい方法かどうかはわかりません:)

同様に見える回答が反対票を投じられました。しかし、私がここで提案していることは、限られたケースで正当化できると思います。

オブザーバブルに現在の値がないことは事実ですが、多くの場合、すぐに利用可能な値を持っています。たとえば、redux / flux / akitaストアでは、いくつかのオブザーバブルに基づいて中央ストアからデータをリクエストでき、その値は通常すぐに利用できます。

この場合は、を実行するsubscribeと、値がすぐに返されます。

それでは、あなたがサービスへの呼び出しがあったとしましょう、と終了時に、あなたはあなたの店から何かの最新の値を取得したい潜在的に放出しない可能性があること：

あなたはこれを試みるかもしれません（そしてあなたは可能な限り「パイプの内側」に物事を保つべきです）：

 serviceCallResponse$.pipe(withLatestFrom(store$.select(x => x.customer)))
                     .subscribe(([ serviceCallResponse, customer] => {

                        // we have serviceCallResponse and customer 
                     });

これの問題は、セカンダリオブザーバブルが値を放出するまでブロックされることです。

私は最近、値がすぐに利用できる場合にのみオブザーバブルを評価する必要があることに気付きました。さらに重要なのは、値が利用できない場合にそれを検出できるようにする必要があったことです。私はこれをやった：

 serviceCallResponse$.pipe()
                     .subscribe(serviceCallResponse => {

                        // immediately try to subscribe to get the 'available' value
                        // note: immediately unsubscribe afterward to 'cancel' if needed
                        let customer = undefined;

                        // whatever the secondary observable is
                        const secondary$ = store$.select(x => x.customer);

                        // subscribe to it, and assign to closure scope
                        sub = secondary$.pipe(take(1)).subscribe(_customer => customer = _customer);
                        sub.unsubscribe();

                        // if there's a delay or customer isn't available the value won't have been set before we get here
                        if (customer === undefined) 
                        {
                           // handle, or ignore as needed
                           return throwError('Customer was not immediately available');
                        }
                     });

上記のすべてについてsubscribe、値を取得するために使用していることに注意してください（@Benが説明しているように）。.value私が持っていても、プロパティを使用していませんBehaviorSubject。

やり過ぎに聞こえるかもしれませんが、これはObservableタイプを維持し、ボイラープレートを減らすためのもう1つの「可能な」ソリューションです...

Observableの現在の値を取得するために、常に拡張ゲッターを作成できます。

これを行うにObservable<T>は、global.d.ts型宣言ファイルでインターフェースを拡張する必要があります。次に、拡張ゲッターをobservable.extension.tsファイルに実装し、最後にタイピングと拡張ファイルの両方をアプリケーションに含めます。

このStackOverflow Answerを参照して、Angularアプリケーションに拡張機能を含める方法を知ることができます。

// global.d.ts
declare module 'rxjs' {
  interface Observable<T> {
    /**
     * _Extension Method_ - Returns current value of an Observable.
     * Value is retrieved using _first()_ operator to avoid the need to unsubscribe.
     */
    value: Observable<T>;
  }
}

// observable.extension.ts
Object.defineProperty(Observable.prototype, 'value', {
  get <T>(this: Observable<T>): Observable<T> {
    return this.pipe(
      filter(value => value !== null && value !== undefined),
      first());
  },
});

// using the extension getter example
this.myObservable$.value
  .subscribe(value => {
    // whatever code you need...
  });

最後に出力された値をObservableとは別に保存できます。その後、必要に応じて読んでください。

let lastValue: number;

const subscription = new Service().start();
subscription
    .subscribe((data) => {
        lastValue = data;
    }
);

これを行う最善の方法は、を使用Behaviur Subjectすることです。以下に例を示します。

var sub = new rxjs.BehaviorSubject([0, 1])
sub.next([2, 3])
setTimeout(() => {sub.next([4, 5])}, 1500)
sub.subscribe(a => console.log(a)) //2, 3 (current value) -> wait 2 sec -> 4, 5

サブスクリプションを作成し、最初に発生したアイテムを破棄した後に破棄できます。Pipeは、Observableを入力として使用し、別のObservableを出力として返しますが、最初のObservableは変更しません。Angular 8.1.0。パッケージ："rxjs": "6.5.3"、"rxjs-observable": "0.0.7"

  ngOnInit() {

    ...

    // If loading with previously saved value
    if (this.controlValue) {

      // Take says once you have 1, then close the subscription
      this.selectList.pipe(take(1)).subscribe(x => {
        let opt = x.find(y => y.value === this.controlValue);
        this.updateValue(opt);
      });

    }
  }