How to get current value of RxJS Subject or Observable

Question

I have an Angular 2 service   import  Storage  from    storage   import  Injectable  from  angular2 core   import  Subject     from  rxjs Subject     Injectable   export class SessionStorage extends Storage     private  isLoggedInSource   new Subject lt boolean gt       isLoggedIn   this  isLoggedInSource asObservable      constructor         super  session          setIsLoggedIn value  boolean        this setItem   isLoggedIn   value       gt          this  isLoggedInSource next value                   Everything works great  But I have another component which doesn t need to subscribe  it just needs to get the current value of isLoggedIn at a certain point in time  How can I do this

User · Accepted Answer

A Subject or Observable doesn t have a current value  When a value is emitted  it is passed to subscribers and the Observable is done with it   If you want to have a current value  use BehaviorSubject which is designed for exactly that purpose  BehaviorSubject keeps the last emitted value and emits it immediately to new subscribers   It also has a method getValue   to get the current value

User · Answer

I encountered the same problem in child components where initially it would have to have the current value of the Subject  then subscribe to the Subject to listen to changes  I just maintain the current value in the Service so it is available for components to access  e g     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 lt boolean gt       isLoggedIn   this  isLoggedInSource asObservable      constructor         super  session        this currIsLoggedIn   false        setIsLoggedIn value  boolean        this setItem   isLoggedIn   value       gt          this  isLoggedInSource next value               this isLoggedIn   value          A component that needs the current value could just then access it from the service  i e    sessionStorage isLoggedIn   Not sure if this is the right practice

User · Answer

I had similar situation where late subscribers subscribe to the Subject after its value arrived    I found ReplaySubject which is similar to BehaviorSubject works like a charm in this case  And here is a link to better explanation  http   reactivex io rxjs manual overview html replaysubject

User · Answer

const observable   of  response    function hasValue value  any      return value     null  amp  amp  value     undefined     function getValue lt T gt  observable  Observable lt T gt    Promise lt T gt      return observable      pipe        filter hasValue         first              toPromise       const result   await getValue observable     Do the logic with the result                                                                 You can check the full article on how to implement it from here  https   www imkrish com blog development simple-way-get-value-from-observable

User · Answer

The best way to do this is using Behaviur Subject  here is an example   var sub   new rxjs BehaviorSubject  0  1   sub next  2  3   setTimeout      gt   sub next  4  5     1500  sub subscribe a   gt  console log a     2  3  current value  - gt  wait 2 sec - gt  4  5

User · Answer

A similar looking answer was downvoted  But I think I can justify what I m suggesting here for limited cases     While it s true that an observable doesn t have a current value  very often it will have an immediately available value  For example with redux   flux   akita stores you may request data from a central store  based on a number of observables and that value will generally be immediately available    If this is the case then when you subscribe  the value will come back immediately   So let s say you had a call to a service  and on completion you want to get the latest value of something from your store  that potentially might not emit   You might try to do this  and you should as much as possible keep things  inside pipes       serviceCallResponse  pipe withLatestFrom store  select x   gt  x customer                          subscribe    serviceCallResponse  customer    gt                                we have serviceCallResponse and customer                             The problem with this is that it will block until the secondary observable emits a value  which potentially could be never   I found myself recently needing to evaluate an observable only if a value was immediately available  and more importantly I needed to be able to detect if it wasn t  I ended up doing this    serviceCallResponse  pipe                         subscribe serviceCallResponse   gt                                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   gt  x customer                               subscribe to it  and assign to closure scope                         sub   secondary  pipe take 1   subscribe  customer   gt  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                                                         Note that for all of the above I m using subscribe to get the value  as  Ben discusses   Not using a  value property  even if I had a BehaviorSubject

User · Answer

Although it may sound overkill  this is just another  possible  solution to keep Observable type and reduce boilerplate     You could always create an extension getter to get the current value of an Observable   To do this you would need to extend the Observable lt T gt  interface in a global d ts typings declaration file  Then implement the extension getter in a observable extension ts file and finally include both typings and extension file to your application   You can refer to this StackOverflow Answer to know how to include the extensions into your Angular application      global d ts declare module  rxjs      interface Observable lt T gt                    Extension Method  - Returns current value of an Observable         Value is retrieved using  first    operator to avoid the need to unsubscribe              value  Observable lt T gt             observable extension ts Object defineProperty Observable prototype   value       get  lt T gt  this  Observable lt T gt    Observable lt T gt        return this pipe        filter value   gt  value     null  amp  amp  value     undefined         first                  using the extension getter example this myObservable  value    subscribe value   gt           whatever code you need

User · Answer

You could store the last emitted value separately from the Observable  Then read it when needed   let lastValue  number   const subscription   new Service   start    subscription      subscribe  data    gt            lastValue   data

User · Answer

A subscription can be created and after taking the first emitted item destroyed  Pipe is a function that uses an Observable as its input and returns another Observable as output  while not modifying the first observable  Angular 8 1 0  Packages   quot rxjs quot    quot 6 5 3 quot    quot rxjs-observable quot    quot 0 0 7 quot    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   gt            let opt   x find y   gt  y value     this controlValue           this updateValue opt

User · Answer

The only way you should  be getting values  out of  an Observable Subject is with subscribe   If you re using getValue   you re doing something imperative in declarative paradigm  It s there as an escape hatch  but 99 9  of the time you should NOT use getValue    There are a few interesting things that getValue   will do  It will throw an error if the subject has been unsubscribed  it will prevent you from getting a value if the subject is dead because it s errored  etc  But  again  it s there as an escape hatch for rare circumstances   There are several ways of getting the latest value from a Subject or Observable in a  Rx-y  way    Using BehaviorSubject  But actually subscribing to it  When you first subscribe to BehaviorSubject it will synchronously send the previous value it received or was initialized with  Using a ReplaySubject N   This will cache N values and replay them to new subscribers  A withLatestFrom B   Use this operator to get the most recent value from observable B when observable A emits  Will give you both values in an array  a  b   A combineLatest B   Use this operator to get the most recent values from A and B every time either A or B emits  Will give you both values in an array  shareReplay    Makes an Observable multicast through a ReplaySubject  but allows you to retry the observable on error   Basically it gives you that promise-y caching behavior   publishReplay    publishBehavior initialValue   multicast subject  BehaviorSubject   ReplaySubject   etc  Other operators that leverage BehaviorSubject and ReplaySubject  Different flavors of the same thing  they basically multicast the source observable by funneling all notifications through a subject  You need to call connect   to subscribe to the source with the subject

[javascript] How to get current value of RxJS Subject or Observable?

Examples related to javascript

Examples related to angular

Examples related to rxjs