Say we have two methods: foo and bar
const foo = function() {
setTimeout(() => {
console.log('foo')
}, 100)
}
const bar = function() {
setTimeout(() => {
console.log('bar')
}, 50)
}
We want to make sure that 'foo' is printed before 'bar'.
Here is how you can do it with rxjs (6.5).
import {of, defer, Subject} from 'rxjs'
import {concatAll} from 'rxjs/operators'
const foo = function() {
const subjectFoo = new Subject()
setTimeout(() => {
subjectFoo.next('foo')
subjectFoo.complete()
}, 100)
return subjectFoo
}
const bar = function() {
const subjectBar = new Subject()
setTimeout(() => {
subjectBar.next('bar')
subjectBar.complete()
}, 100)
return subjectBar
}
const source = of(defer(foo), defer(bar))
source.pipe(concatAll()).subscribe(console.log)
I know I am changing the signature of foo and bar. This might not be possible in some cases.
A few things to note:
- Let your function return a
Subject; - Complete the
Subjectin the callback of the async operation; -
deferthe functions and build a observable; make sure you put them in the right order - Concat all of them with
pipe(concatAll() - Subscribe to the final observable.
Top comments (0)