Angular 2 / Angular 4 / Angular 5 Search Filter Pipe
Filter search items
Angular 2 filter to make custom search. Works with Angular 4 and Angular 5 too.
Install
npm i ng2-search-filter --save
yarn add ng2-search-filter
Usage
In case you're using systemjs - see configuration here.
Import Ng2SearchPipeModule to your module
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app';
import { Ng2SearchPipeModule } from 'ng2-search-filter';
@NgModule({
imports: [BrowserModule, Ng2SearchPipeModule],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule {}
And use pipe in your component
import { Component } from '@angular/core';
@Component({
selector: 'example-app',
template: `
<div>
<input type="text" [(ngModel)]="term">
<div *ngFor = "let item of items |filter:term" >
<p>
{{item.name}}
</p>
</div>
</div>
`
})
export class AppComponent {
items: string[] = [{ name: "archie" }, { name: "jake" }, { name: "richard" }];
}
Support ng2-search-filter
ng2-search-filter is completely free and open-source. If you find it useful, you can show your support by 🌟 it or sharing it in your social network.
Contribute
Please do 🙂
License
MIT © Solodynamo
