takeWhile
💡 When the optional inclusive parameter is set to true it will also emit the first item that didn't pass the predicate.
Example 1: Take values under limit
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { of } from 'rxjs';import { takeWhile } from 'rxjs/operators';//emit 1,2,3,4,5const source$ = of(1, 2, 3, 4, 5);//allow values until value from source is greater than 4, then completesource$.pipe(takeWhile(val => val <= 4))// log: 1,2,3,4.subscribe(val => console.log(val));
Example 2: (v6.4+) takeWhile with inclusive flag
( StackBlitz )
// RxJS v6.4+import { of } from 'rxjs';import { takeWhile, filter } from 'rxjs/operators';const source$ = of(1, 2, 3, 9);source$// with inclusive flag, the value causing the predicate to return false will also be emitted.pipe(takeWhile(val => val <= 3, true))// log: 1, 2, 3, 9.subscribe(console.log);
Example 3: Difference between takeWhile and filter
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { of } from 'rxjs';import { takeWhile, filter } from 'rxjs/operators';// emit 3, 3, 3, 9, 1, 4, 5, 8, 96, 3, 66, 3, 3, 3const source$ = of(3, 3, 3, 9, 1, 4, 5, 8, 96, 3, 66, 3, 3, 3);// allow values until value from source equals 3, then completesource$.pipe(takeWhile(it => it === 3))// log: 3, 3, 3.subscribe(val => console.log('takeWhile', val));source$.pipe(filter(it => it === 3))// log: 3, 3, 3, 3, 3, 3, 3.subscribe(val => console.log('filter', val));
📰 - Official docs
Completing a stream with takeWhile
🎥 💵 - John Linquist
📁 Source Code: https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/takeWhile.ts
Last updated 1 month ago