How to make one Observable sequence wait for another to complete before emitting?

javascript observable rxjs
Stephen picture Stephen · May 29, 2015 · Viewed 129.8k times · Source

Say I have an Observable, like so:

var one = someObservable.take(1);

one.subscribe(function(){ /* do something */ });

Then, I have a second Observable:

var two = someOtherObservable.take(1);

Now, I want to subscribe() to two, but I want to make sure that one has completed before the two subscriber is fired.

What kind of buffering method can I use on two to make the second one wait for the first one to be completed?

I suppose I am looking to pause two until one is complete.

Answer

paulpdaniels picture paulpdaniels · May 29, 2015

A couple ways I can think of

import {take, publish} from 'rxjs/operators'
import {concat} from 'rxjs'

//Method one

var one = someObservable.pipe(take(1));
var two = someOtherObservable.pipe(take(1));
concat(one, two).subscribe(function() {/*do something */});

//Method two, if they need to be separate for some reason
var one = someObservable.pipe(take(1));
var two = someOtherObservable.pipe(take(1), publish());
two.subscribe(function(){/*do something */});
one.subscribe(function(){/*do something */}, null, two.connect.bind(two));

Related questions

Return an empty Observable

The function more() is supposed to return an Observable from a get request export class Collection{ public more = (): Observable<Response> => { if (this.hasMore()) { return this.fetch(); } else{ // return empty observable } } private fetch = (): Observable<Response> => { …

Read More
Simple filter on array of RXJS Observable

I am starting my project with Angular2 and the developers seem to recommend RXJS Observable instead of Promises. I have achieved to retrieve a list of elements (epics) from the server. But how can I filter the elments by using …

Read More
Promise.all behavior with RxJS Observables?

In Angular 1.x I would sometimes need to make multiple http requests and do something with all the responses. I would throw all the promises in an array and call Promise.all(promises).then(function (results) {...}). Angular 2 best practices seem …

Read More