ng4-pipes

A simple yet elegant way to apply filtering functionality on your HTML tables in Angular using pipes.

Search Filter

Table - initially

Table - Filtering by Name

Table - Filtering by fields 10th and Age

Installation

Install using npm

npm install --save ng4-pipes

Usage

1. Import into your.module.ts

import { SearchFilter } from "ng4-pipes/src/app/pipes/searchFilter"

// and  add in your module's declarations array 
declarations: [ 
    SearchFilter 
    ]

2. Import the required filter in your.component.ts

import { SearchFilter } from "ng4-pipes/src/app/pipes/searchFilter";

3. Use in your.component.html

Define the textbox to be used to search in the table

<input type="text" [(ngModel)]="search"/>

Use the pipe on the target table

<tr *ngFor="let student of students | SearchFilter:search">

Troubleshooting

Please follow this guidelines when reporting bugs and feature requests:

1. Use GitHub Issues board to report bugs and feature requests (not our email address)
2. Please always write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.

Thanks for understanding!

License

The MIT License (see the LICENSE file for the full text)