Burst of Ice
Burst of Ice

Reputation: 386

Rxjs combine Observable of arrays

I show an overview of dates, (I simplified my example)

someArray$: Observable<Date[]> = of(
new Date(2019, 11, 1),
new Date(2019, 11, 2),
new Date(2019, 11, 3));

Then I make a call to the backend and get some data like this:

anotherArray$: Observable<MyClass[]> = of(
{date: new Date(2019, 11, 1), active: true},
{date: new Date(2019, 11, 2), active: false},
{date: new Date(2019, 11, 3), active: false});

Now I already show someArray$ with an *ngFor in my template so I thought I could combine them somehow without subscribing and then use the boolean value from the second array to visualise activity.

Upvotes: 0

Views: 100

Answers (1)

benshabatnoam
benshabatnoam

Reputation: 7630

Follow this steps:

  1. change your someArray$ to:
someArray$ = of([
  { date: new Date(2019, 11, 1) },
  { date: new Date(2019, 11, 2) },
  { date: new Date(2019, 11, 3) }
]);
  1. Merge the two observables:
import { merge } from 'rxjs';

dates$ = merge(
  this.someArray$,
  this.anotherArray$
);
  1. Bind dates$ with an *ngFor in your template instead of someArray$

Here is a StackBlitz DEMO (notice the active column values changing after 5 seconds)

Upvotes: 1

Related Questions