RxJS - Multiple sources for .withLatestFrom

AngularRxjsNgrx

Angular Problem Overview


I want to merge the latest emitted values from multiple Observables, so right now I'm using .withLatestFrom. Except, it nests the data together in nested arrays instead of pushing the data into a new array value. Example code below.

Any ideas on how I can retrieve multiple Observable emits using .withLatestFrom?

source0
  .withLatestFrom(source1)
  .withLatestFrom(source2)
  .withLatestFrom(source3)
  .map((data) => { console.log(data) });

Angular Solutions


Solution 1 - Angular

withLatestFrom supports multiple observables:

.withLatestFrom(source1, source2, source3)
.map((data) => { console.log(data) });

-> [val, value1, value2, value3]

It also supports function as it's last parameter, so you can get values other than arrays:

observable$
    .withLatestFrom(source1, source2, (val, one, two) => {
        return {val: val, one: one, two: two};
     });

Solution 2 - Angular

withLatestFrom accepts multiple observables. so you can write it like:

let obs1$ = Rx.Observable.of('a');
let obs2$ = Rx.Observable.of('b');

Rx.Observable.interval(1000)
  .withLatestFrom(obs1$, obs2$)
  .subscribe(x=>console.log(x))

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPreda70RView Question on Stackoverflow
Solution 1 - AngularadharrisView Answer on Stackoverflow
Solution 2 - AngularJulia PassynkovaView Answer on Stackoverflow