Filter Operator in Angular Observable

The Filter Operator in Angular filters the items emitted by the source Observable using a condition (predicate). It emits only those values that satisfy the condition and ignores the rest.

Filter in Angular

The filter is the simplest and most used RxJs Operator in Angular. The Filter Operator takes two arguments.

Syntax

The first argument is the predicate function. This function is evaluated against each value of the source observable. Filter emits only those values that satisfy the predicate. The predicate function takes two parameters. The first one is the value emitted by the source. The second argument is zero-based index. 

The second argument thisArg is Optional. It determines the value of this in the predicate function

Filter Example

The following example filter function returns true only if the value is an even number.

Source Code

We use the new syntax (introduced in RxJs 6.4) for subscribing to observables’ angular. You can also use the older syntax, which is shown below.

Filter Empty or undefined

The following code will filter the empty or undefined values from the observable array.

Filter object or array

The code below uses the filter operator to filter the observable stream of objects. It will return only if the age exceeds 30 and discards the rest.

Source Code

Reference

Filter

Read More

1 thought on “Filter Operator in Angular Observable”

  1. fromArray is only available in rxjs version 6 I believe. Please verify you version of ‘rxjs’ in package.json if you have issues importing.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top