soniabehal/ng4-pipes

Repository files navigation

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

table

filteres by name

filtered by age

Install using npm

npm install --save ng4-pipes
  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 
    ]
  1. Import the required filter in your.component.ts
import { SearchFilter } from "ng4-pipes/src/app/pipes/searchFilter";
  1. 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">

Please follow this guidelines when reporting bugs and feature requests:

  1. Use 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!

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

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •