filter<T>(predicate: (value: T, index: number) => boolean, thisArg?: any): MonoTypeOperatorFunction<T>
predicate | Una función que evalúa cada valor emitido por el Observable fuente. Si retorna true , el valor se emite. Si retorna false , el valor no se emite. |
thisArg | Opcional. El valor por defecto es undefined .
Un argumento opcional para determinar el valor del this en la función predicate
|
MonoTypeOperatorFunction<T>
: Un Observable de valores del Observable fuente que han cumpliado la condición especificada por la función predicate
.
Al igual que Array.prototype.filter()
, solo emite un valor si cumple una condición determinada.
Es similar al método Array.prototype.filter()
. Este operador emite únicamente aquellos valores del Observable fuente que cumplan la condición especificada en la función predicate
, es decir, aquellos valores que, al proporcionárselos a la función, hagan que esta devuelva true
.
Emitir los números mayores que 5
import { filter } from "rxjs/operators";
import { range } from "rxjs";
const number$ = range(1, 10);
number$.pipe(filter((n) => n > 5)).subscribe(console.log);
// Salida: 6, 7, 8, 9, 10
Emitir todas las teclas, excepto la barra espaciadora
import { filter, map } from "rxjs/operators";
import { fromEvent } from "rxjs";
const key$ = fromEvent<KeyboardEvent>(document, "keydown");
key$
.pipe(
map(({ code }) => code),
filter((code) => code !== "Space")
)
.subscribe(console.log);
// Salida: KeyX, KeyO...
Filtrar los lenguages de tipo Multiparadigma
import { filter } from "rxjs/operators";
import { from } from "rxjs";
const language$ = from([
{ name: "Java", type: "Orientado a objetos" },
{ name: "Ruby", type: "Multiparadigma" },
{ name: "Haskell", type: "Funcional" },
{ name: "Rust", type: "Multiparadigma" },
]);
language$
.pipe(filter(({ type }) => type !== "Multiparadigma"))
.subscribe(console.log);
/* Salida:
{ name: "Java", type: "Orientado a objetos" },
{ name: "Haskell", type: "Funcional" }
*/
Emite solo los eventos click cuyo target sea un elemento DIV
import { fromEvent } from "rxjs";
import { filter } from "rxjs/operators";
const clicks = fromEvent(document, "click");
const clicksOnDivs = clicks.pipe(filter((ev) => ev.target.tagName === "DIV"));
clicksOnDivs.subscribe((x) => console.log(x));
Documentación oficial en inglés