FilterDataPipe:

Filter data recursively to return values based on passed in string values (using a space as a delimiter) in Angular using pipe directive. Most useful to filter display table data but can be used for all Object or Array types.

Installation

npm i filterdatapipe

Usage

import FilterDataPipe in app.module.ts to make it available across entire app

import { FilterDataPipe } from 'filterdatapipe';

create a input in your html file to create what you will filter against.

<input [(ngModel)]="filterInput" >

use name filterData to filter down Object or Array

<div *ngFor="let item of myObjectOrArray | filterData: filterInput">

Details

FilterDataPipe stringifys all object and array values recursively and maps them to an array. It then checks the stringifyed values against the input values to filter out any data that is not mapped to the string array and returns the full object or array back to the view.