Come ottenere il valore corrente di RxJS Subject o Observable?

Ho un servizio 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);
    });
  }
}

Funziona tutto alla grande. Ma ho un altro componente che non ha bisogno di abbonarsi, deve solo ottenere il valore corrente di isLoggedIn in un determinato momento. Come posso fare questo?

A Subjecto Observablenon ha un valore corrente. Quando viene emesso un valore, viene passato agli abbonati e Observableviene terminato.

Se si desidera avere un valore corrente, utilizzare quello BehaviorSubjectprogettato esattamente per quello scopo. BehaviorSubjectmantiene l'ultimo valore emesso e lo emette immediatamente ai nuovi abbonati.

Ha anche un metodo getValue()per ottenere il valore corrente.

L'unico modo in cui dovresti ottenere valori "fuori da" un osservabile / soggetto è con iscriviti!

Se stai usando getValue()stai facendo qualcosa di imperativo nel paradigma dichiarativo. È lì come tratteggio di fuga, ma il 99,9% delle volte NON dovresti usarlo getValue(). Ci sono alcune cose interessanti che getValue()faranno: genererà un errore se il soggetto è stato cancellato, ti impedirà di ottenere un valore se il soggetto è morto perché è stato errato, ecc. Ma, ancora una volta, è lì come una via di fuga schiusa per rare circostanze.

Esistono diversi modi per ottenere l'ultimo valore da un soggetto o osservabile in modo "Rx-y":

1. Utilizzo BehaviorSubject: ma in realtà iscrivendoti ad esso . Quando ti iscrivi per la prima BehaviorSubjectvolta, invia in modo sincrono il valore precedente che ha ricevuto o con cui è stato inizializzato.
2. Utilizzo di ReplaySubject(N): Questo memorizzerà i Nvalori nella cache e li riprodurrà ai nuovi abbonati.
3. A.withLatestFrom(B): Utilizzare questo operatore per ottenere il valore più recente da osservabile Bquando viene Aemesso osservabile . Ti darà entrambi i valori in un array [a, b].
4. A.combineLatest(B): Utilizzare questo operatore per ottenere i valori più recenti da Ae Bogni volta Ao Bemette. Ti darà entrambi i valori in un array.
5. shareReplay(): Crea un multicast osservabile tramite a ReplaySubject, ma consente di riprovare l'osservabile in caso di errore. (Fondamentalmente ti dà quel comportamento di cache promettente).
6. publishReplay(), publishBehavior(initialValue), multicast(subject: BehaviorSubject | ReplaySubject), Ecc: Altri operatori che sfruttano BehaviorSubjecte ReplaySubject. Diversi gusti della stessa cosa, fondamentalmente multicast la fonte osservabile incanalando tutte le notifiche attraverso un argomento. Devi chiamare connect()per iscriverti alla fonte con l'oggetto.

Ho avuto una situazione simile in cui gli abbonati in ritardo si iscrivono all'oggetto dopo che è arrivato il suo valore.

Ho trovato ReplaySubject che è simile a BehaviorSubject funziona come un incantesimo in questo caso. Ed ecco un link per una migliore spiegazione: 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
// .................
// .................
// .................

Puoi consultare l'articolo completo su come implementarlo da qui. https://www.imkrish.com/how-to-get-current-value-of-observable-in-a-clean-way/

Ho riscontrato lo stesso problema nei componenti figlio in cui inizialmente avrebbe dovuto avere il valore corrente dell'oggetto, quindi sottoscrivere l'oggetto per ascoltare le modifiche. Mantengo semplicemente il valore corrente nel Servizio in modo che sia disponibile per l'accesso ai componenti, ad esempio:

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

Un componente che necessita del valore corrente potrebbe accedervi dal servizio, ad esempio:

sessionStorage.isLoggedIn

Non sono sicuro se questa è la pratica giusta :)

Una simile ricerca risposta è stata downvoted. Ma penso di poter giustificare ciò che sto suggerendo qui per casi limitati.

Mentre è vero che un osservabile non ha un valore corrente , molto spesso avrà un valore immediatamente disponibile . Ad esempio con i negozi redux / flux / akita è possibile richiedere dati a un negozio centrale, in base a un numero di osservabili e quel valore sarà generalmente immediatamente disponibile.

Se questo è il caso allora subscribe, il valore tornerà immediatamente.

Supponiamo quindi che tu abbia ricevuto una chiamata a un servizio e, al termine, desideri ottenere l'ultimo valore di qualcosa dal tuo negozio, che potenzialmente potrebbe non emettere :

Potresti provare a farlo (e dovresti, per quanto possibile, tenere le cose 'dentro le pipe'):

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

                        // we have serviceCallResponse and customer 
                     });

Il problema è che si bloccherà fino a quando l'osservabile secondario non emetterà un valore, che potenzialmente potrebbe non essere mai.

Mi sono ritrovato di recente a dover valutare un osservabile solo se un valore era immediatamente disponibile e, soprattutto, dovevo essere in grado di rilevare se non lo fosse. Ho finito per fare questo:

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

Nota che per quanto sopra sto usando subscribeper ottenere il valore (come discute da @Ben). Non usare una .valueproprietà, anche se avevo un BehaviorSubject.

Anche se può sembrare eccessivo, questa è solo un'altra soluzione "possibile" per mantenere il tipo osservabile e ridurre la piastra della caldaia ...

Puoi sempre creare un getter di estensione per ottenere il valore corrente di un osservabile.

Per fare ciò è necessario estendere l' Observable<T>interfaccia in un global.d.tsfile di dichiarazione delle tipizzazioni. Quindi implementare il getter dell'estensione in un observable.extension.tsfile e infine includere sia le tipizzazioni che il file dell'estensione nell'applicazione.

È possibile fare riferimento a questa risposta StackOverflow per sapere come includere le estensioni nell'applicazione angolare.

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

È possibile memorizzare l'ultimo valore emesso separatamente dall'Osservabile. Quindi leggilo quando necessario.

let lastValue: number;

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

Il modo migliore per farlo è usare Behaviur Subject, ecco un esempio:

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

È possibile creare un abbonamento e dopo aver eliminato il primo elemento emesso. Pipe è una funzione che utilizza un osservabile come input e restituisce un altro osservabile come output, senza modificare il primo osservabile. Angolare 8.1.0. Pacchetti: "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);
      });

    }
  }