Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to switch to another Observable when a source Observable emits but only use latest value

I have two observables

  • load$ is a stream of load events, emitted on startup or when a reload button is clicked
  • selection$ is a stream of selected list items, emitted when a list item is selected

I'm wondering if there is an operator that lets me (A) get the latest value emitted by selection$ whenever load$ emits, while (B) ignoring the value emitted by load$.

I was able to accomplish (A) by using withLatestFrom but that doesn't satisfy (B) because withLatestFrom does not ignore the source observable.

load$.withLatestFrom(selection$).subscribe(([_, latestSelection) => {
  // _ is not needed and I don't like to write code like this
  // I only need the latest selection
});

I've looked at switchMapTo which satisfies (B) but not (A) without also using first() or take(1).

load$.switchMapTo(selection$.take(1)).subscribe(latestSelection => {
  // I would like to avoid having to use take(1)
});

I'm looking for a hypothetical switchMapToLatestFrom operator.

load$.switchMapToLatestFrom(selection$).subscribe(latestSelection => {
  // switchMapToLatestFrom doesn't exist :(
});

Unfortunately it doesn't exist and I don't like the two other ways that I came up with because it's not immediately obvious why the code contains take(1) or unused arguments.

Are there any other ways to combine two observables so that the new observable emits only the latest value from the second observable whenever the first observable emits?

like image 745
Steven Liekens Avatar asked Jul 13 '17 09:07

Steven Liekens


People also ask

How do you get the last emitted value from Observable?

BehaviorSubject is the answer here. Rather than a standard subject (Observable) that just emits values as they come in, a BehaviorSubject emits the last value upon subscribe() . You can also get the last value manually using the BehaviorSubjects getValue() method.

Which Observable operators will you use to transform the values of an Observable by applying a function to each value?

RxJS map() operator is a transformation operator used to transform the items emitted by an Observable by applying a function to each item. It applies a given project function to each value emitted by the source Observable and then emits the resulting values as an Observable.

What RxJS operators can be used to change from one Observable to another?

This map() operator is defined in a pipe where you can modify the content of emitted values from one observable to form another new observable. Inside the pipe, you can add your modification logic; in this case, it converts the emitted values to uppercase.

Which operator is used to alter each value coming out of an Observable?

map Operator it is used to to transform the each value emitted by the source observable. simply it creates new observable after manipulating the each items of source observable. We use map() operator in pipe function where we can chain multiple operator together to get the desired output from an observable.


1 Answers

withLatestFrom takes an optional project function that's passed the values.

You can use it to ignore the value from load$ and emit only the latest selection:

load$
  .withLatestFrom(selection$, (load, selection) => selection)
  .subscribe(selection => {
    // ...
  });
like image 73
cartant Avatar answered Oct 13 '22 06:10

cartant