Learn RxJS
Search…
concatAll
signature: concatAll(): Observable
concatAll(): ObservableCollect observables and subscribe to next when previous completes.
Examples
Example 1: concatAll with observable
1
// RxJS v6+
2
import { map, concatAll } from 'rxjs/operators';
3
import { of, interval } from 'rxjs';
4
5
//emit a value every 2 seconds
6
const source = interval(2000);
7
const example = source.pipe(
8
//for demonstration, add 10 to and return as observable
9
map(val => of(val + 10)),
10
//merge values from inner observable
11
concatAll()
12
);
13
//output: 'Example with Basic Observable 10', 'Example with Basic Observable 11'...
14
const subscribe = example.subscribe(val =>
15
console.log('Example with Basic Observable:', val)
16
);
Copied!
Example 2: concatAll with promise
1
// RxJS v6+
2
import { map, concatAll } from 'rxjs/operators';
3
import { interval } from 'rxjs';
4
5
//create and resolve basic promise
6
const samplePromise = val => new Promise(resolve => resolve(val));
7
//emit a value every 2 seconds
8
const source = interval(2000);
9
10
const example = source.pipe(
11
map(val => samplePromise(val)),
12
//merge values from resolved promise
13
concatAll()
14
);
15
//output: 'Example with Promise 0', 'Example with Promise 1'...
16
const subscribe = example.subscribe(val =>
17
console.log('Example with Promise:', val)
18
);
Copied!
Example 3: Delay while inner observables complete
1
// RxJS v6+
2
import { take, concatAll } from 'rxjs/operators';
3
import { interval, of } from 'rxjs';
4
5
const obs1 = interval(1000).pipe(take(5));
6
const obs2 = interval(500).pipe(take(2));
7
const obs3 = interval(2000).pipe(take(1));
8
//emit three observables
9
const source = of(obs1, obs2, obs3);
10
//subscribe to each inner observable in order when previous completes
11
const example = source.pipe(concatAll());
12
/*
13
output: 0,1,2,3,4,0,1,0
14
How it works...
15
Subscribes to each inner observable and emit values, when complete subscribe to next
16
obs1: 0,1,2,3,4 (complete)
17
obs2: 0,1 (complete)
18
obs3: 0 (complete)
19
*/
20
21
const subscribe = example.subscribe(val => console.log(val));
Copied!
Related Recipes
Additional Resources
- 🎥 💵 - André Staltz
Last modified 1yr ago