π‘ If you would like to complete an observable when a condition fails, check out takeWhile!
ββββ
Example 1: filter for even numbers
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { from } from 'rxjs';import { filter } from 'rxjs/operators';β//emit (1,2,3,4,5)const source = from([1, 2, 3, 4, 5]);//filter out non-even numbersconst example = source.pipe(filter(num => num % 2 === 0));//output: "Even number: 2", "Even number: 4"const subscribe = example.subscribe(val => console.log(`Even number: ${val}`));
Example 2: filter objects based on property
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { from } from 'rxjs';import { filter } from 'rxjs/operators';β//emit ({name: 'Joe', age: 31}, {name: 'Bob', age:25})const source = from([{ name: 'Joe', age: 31 },{ name: 'Bob', age: 25 }]);//filter out people with age under 30const example = source.pipe(filter(person => person.age >= 30));//output: "Over 30: Joe"const subscribe = example.subscribe(val => console.log(`Over 30: ${val.name}`));
Example 3: filter for number greater than specified value
( StackBlitz | jsBin | jsFiddle )
// RxJS v6+import { interval } from 'rxjs';import { filter } from 'rxjs/operators';β//emit every secondconst source = interval(1000);//filter out all values until interval is greater than 5const example = source.pipe(filter(num => num > 5));/*"Number greater than 5: 6""Number greater than 5: 7""Number greater than 5: 8""Number greater than 5: 9"*/const subscribe = example.subscribe(val =>console.log(`Number greater than 5: ${val}`));
βBattleship Gameβ
βHTTP Pollingβ
βGame Loopβ
βLockscreenβ
βMine Sweeper Gameβ
βSave Indicatorβ
βfilter π° - Official docs
βAdding conditional logic with filterβ
π₯ π΅ - John Linquist
βFiltering operator: filterβ
π₯ π΅ - AndrΓ© Staltz
βBuild your own filter operatorβ
π₯ - Kwinten Pisman
π Source Code: https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/filter.tsβ