how to flatten the nested array in rxjs

Question

I am using forkJoin to subscribe multiple inner observable. How can I flat nested array to single level array.

const x$ = of([1, 2, 3, 4]);
const y$ = of([2, 4]);

x$.pipe(
  switchMap((t) => {
    const innerArr$ = t.map((z) => y$.pipe(map((_) => _.map((y) => y * z))));
    return forkJoin(innerArr$);
  })
).subscribe(console.log);

Playground Link: Rxjs stackblitz

Expected Output:

[2,4,4,8,6,12,8,16]

Picci · Accepted Answer · 2021-12-16 15:20:03Z

1

You can try this

x$.pipe(
  switchMap((t) => {
    const innerArr$ = t.map((z) => y$.pipe(map((_) => _.map((y) => y * z))));
    return forkJoin(innerArr$);
  }),
  mergeMap((aa) => from(aa).pipe(mergeMap((a) => a)))
).subscribe(console.log);

The key here is

mergeMap is actually a flatten Observable-like objects (actually mergeMap was formerly known as flatMap)
an Array is treated as an Observable since it actually can represent a stream of data, which is what an Observable is

answered Dec 16, 2021 at 15:20

Picci

17.8k16 gold badges80 silver badges125 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

GreyBeardedGeek · Accepted Answer · 2021-12-16 15:37:36Z

0

+1 to the answer by @Picci if you want a stream of numbers.

If you want to wind up with a single array instead, you can flatten the result in the subscription:

x$.pipe(
  switchMap((t) => {
    const innerArr$ = t.map((z) => y$.pipe(map((_) => _.map((y) => y * z))));
    return forkJoin(innerArr$);
  })
)
.subscribe((res) => {
  console.log([].concat.apply([], res));
})

answered Dec 16, 2021 at 15:37

GreyBeardedGeek

30.3k2 gold badges51 silver badges71 bronze badges

Collectives™ on Stack Overflow

how to flatten the nested array in rxjs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related