Processing Multiple Observables

index.ts

import { forkJoin, mergeAll, mergeMap, tap } from "rxjs";
import { getValues, doubleValue, tripleValue } from "./service";

getValues()
  .pipe(
    tap((value) => console.log(`Got ${value.join(", ")}\n`)),
    mergeAll(),
    tap((value) => console.log(`Processing ${value}`)),
    mergeMap((value) => forkJoin([doubleValue(value), tripleValue(value)]))
  )
  .subscribe((value) => console.log(`Processed and got ${value.join(", ")}\n`));

/* Output:
 *
 * Got 1, 2, 3, 4, 5
 *
 * Processing 1
 * Processed and got 2, 3
 *
 * Processing 2
 * Processed and got 4, 6
 *
 * Processing 3
 * Processed and got 6, 9
 */

service.ts

import { Observable, of } from "rxjs";

export function getValues(): Observable<number[]> {
  return of([1, 2, 3]);
}

export function doubleValue(value: number): Observable<number> {
  return of(value * 2);
}

export function tripleValue(value: number): Observable<number> {
  return of(value * 3);
}