ng2 search filter

Winkel 2 / Winkel 4 / Winkel 5 Suchfilterrohr

Suchelemente filtern

Angular 2-Filter für eine benutzerdefinierte Suche. Funktioniert auch mit Angular 4 und Angular 5.

Installieren

 npm i ng2-search-filter --save

 yarn add ng2-search-filter 

Verwendung

Falls Sie systemjs verwenden – siehe Konfiguration hier.

Importieren Sie Ng2SearchPipeModule in Ihr Modul

 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 { }

Und verwenden Sie Pipe in Ihrer Komponente, nachdem Sie es in Ihrer Komponente deklariert und initialisiert haben:

 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" } ] ;
  term = '' ;
} 

Unterstützt ng2-Suchfilter

ng2-search-filter ist völlig kostenlos und Open Source. Wenn Sie es nützlich finden, können Sie Ihre Unterstützung zeigen, indem Sie ? es oder teilen Sie es in Ihrem sozialen Netzwerk.

Beitragen

Bitte tun Sie es?

Lizenz

MIT © Solodynamo