News

This is really just for archive sake, but since it took a bit of looking into, I thought it worth posting since I hadn’t actually found the answer anywhere.

If you want to fire off several observable objects async but have to wait until they’re all completed before moving on, you’ll want to give the static forkJoin method a look.  ForkJoin will take an array of observables, execute them and give you back an array of their results when all have completed.

Unfortunately, if you’re using a version of RxJS that’s previous to 5.0, nested observables will complete their task, but forkJoin will not see it without a subscriber.complete() call from the observables that have a nested observable.  This is because RxJS does not have a complete() method on the Observable object until 5.0.0 alpha.1 (as of this writing, i’ve tested with 5.0.0-alpha.1 and 5.0.0-beta.11 successfully).  Once I was able to call “complete()” from the observable that was added to the forkJoin initially, the results were returned successfully.

Conclusion (because that sounded confusing): If you have observables that rely on other observables (nested), they must call “complete()” on the subscriber for forkJoin to realize the jobs are complete.

See the Pen RxJS Observable – forkJoin Example by John Grden (@neoRiley) on CodePen.

Thanks to Brian Troncone for the original JSFiddle

Have a bandit day!

Tweet