Search code examples
rxjsrx-javareactivex

Rx : Force observable to take at least N seconds to complete

I am making a splash screen for my app. I want it to last at least N seconds before going to the main screen.

I have an Rx variable myObservable that returns data from the server or from my local cache. How do I force myObservable to complete in at least N seconds?

myObservable
// .doStuff to make it last at least N seconds
   .subscribe(...)
Solution

  • You can use forkJoin to wait until two Observables complete:

    Observable.forkJoin(myObservable, Observable.timer(N), data => data)
  .subscribe(...);

    For RxJS 6 without the deprecated result selector function:

    forkJoin(myObservable, Observable.timer(N)).pipe(
  map(([data]) => data),
)
.subscribe(...);

    Edit: As mentioned in comments, Observable.timer(N) with just one parameter will complete after emitting one item so there's not need to use take(1).