CODEWITHSUNDEEP
javascripttypescriptrxjs
Ole
Ole

Reputation: 46890

combineLatest is not emitting when the second observable changes?

This is a stackblitz demo of the below code.

There are two observables - active$ - collection$:

const central:EStore<Todo> = new EStore();
const collection:EStore<Todo> = new EStore();
const active$ = central.observeActive();
const collection$ = collection.observe();

When collection$ notifies, as logged in this statement:

collection$.subscribe(v=>console.log('Todo added to collection'));

This combineLatest function does not fire:

const isActiveTodoInCollection$:Observable<boolean> = 
     combineLatest(active$, 
                   collection$, 
                   (a, c)=>{
                     console.log("Firing");
      if (getMapValue(central.active)) {
             return collection.containsById(getMapValue(central.active));
      }
      return false;               
});

However if we cause the active$ observable to notify, the isActiveTodoInCollection$ observable will fire.

Why does it not fire when the collection$ observable notifies?

Another odd thing is that this will produce a logging statement when collection$ notifies:

const t$ = combineLatest(collection$, (c)=>console.log("collection$ performing a notification"));

t$.subscribe();

But if we add the active$ observable to the arguments it stops notifying. It's as if active$ has to notify first ...

Upvotes: 1

Views: 1860

Answers (1)

karthick
karthick

Reputation: 12176

combineLatest works only when each of the observables emits a value at least once.

The central.post(todo) doesn't really complete because observeActive() in your case really observes only when central.addActive(todo) is called, hence there isn't anything to combine.

example to illustrate the issue, comment two$ in the below code and uncomment the following line, you will see the difference

import { combineLatest, Observable } from "rxjs";

const one$ = new Observable(subscriber => {
  setTimeout(() => {
    console.log("set");
    subscriber.next(42);
  }, 1000);
});

const two$ = new Observable(subscriber => {});

// comment above two$ and uncomment this
/*const two$ = new Observable(subscriber => {
  subscriber.next(56);
});*/

combineLatest(one$, two$).subscribe(([one, two]) => {
  console.log(
    ` One Latest: ${one},
      Two Latest: ${two}`
  );
});

https://codesandbox.io/s/modest-vaughan-1t9k0

Upvotes: 3

Related Questions