Angular2: How to cancel Observable.combineLatest calls?

Question

I have performance problems in my angular2 application because I have a large Observable.combineLatest () with many inputs that change quickly and I want to cancel the callback:

myData$ = Observable.combineLatest( this.store.let(fromRoot.getFoo), this.store.let(fromRoot.getBar), this.store.let(fromRoot.getFoobar), this.store.let(fromRoot.getBarfoo), (foo, bar, foobar, barfoo) => { ... }); 

The calling debounce after the fact, for example. Observable.combineLatest (...). DebounceTime (300) is useless because the CPU intensive task happens inside the combLatest callback, which still often calls the call.

I think I need to combine another Observable, but I'm not sure how to do this, any ideas?

Answer 1

The combineLatest project function is essentially a map operator. You can redo things like this:

 myData$ = Observable.combineLatest( this.store.let(fromRoot.getFoo), this.store.let(fromRoot.getBar), this.store.let(fromRoot.getFoobar), this.store.let(fromRoot.getBarfoo) ) .debounceTime(300) .map(([foo, bar, foobar, barfoo]) => { ... }); 

Answer 2

When using rxjs> v6, you should use the rxjs channel function in conjunction with the debounceTime statement, for example

 import {combineLatest, timer} from 'rxjs'; import {debounceTime} from 'rxjs/operators'; function testCombineLatest() { const startTime = Date.now(); const timerOne$ = timer(1000, 1000); const timerTwo$ = timer(1300, 1000); combineLatest(timerOne$, timerTwo$) .pipe(debounceTime(600)) .subscribe(([timer1, timer2]) => { console.log('TimeElapsed:', Date.now() - startTime); console.log('Timer Latest:', timer1, timer2); }); } testCombineLatest();