@cyberjs.on/ng-coolaction-fit-pipe
v1.1.0-0
Published
A useful pipe to filter collections.
Downloads
6
Readme
NgCoolactionFitPipe
Dependencies
- @cyberjs.on/coolaction-fit 1.0.0-2.
Installing
$ npm i @cyberjs.on/ng-coolaction-fit-pipe --save
Usage
Include the module into imports
metadata key of NgModule
decorator in your application context, importing NgCoolFilterPipeModule
from @cjs.on/ng-cool-filter-pipe
, like that.
import { NgCoolactionFitPipeModule } from '@cyberjs.on/ng-coolaction-fit-pipe';
@NgModule({
imports: [
NgCoolactionFitPipeModule
]
})
export class MyModule() { }
Usage example with *ngFor
directive
Component source control
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.sass']
})
export class AppComponent {
objectCollection: object[];
filterTerm: string;
constructor() {
this.objectCollection = [
{
name: 'First Name First Last Name',
gender: 'male'
},
{
name: 'Second Name Second Last Name',
gender: 'male'
},
{
name: 'Third Name Third Last Name',
gender: 'famale'
},
{
name: 'Fourty Name Fourty Last Name',
gender: 'male'
},
{
name: 'Fifty Name Fifty Last Name',
gender: 'female'
}
];
this.filterTerm = '';
}
}
Template
<input
type="text"
[(ngModel)]="filterTerm"
[ngModelOptions]="{
standalone: true
}"
/>
<ul>
<li *ngFor="let object of objectCollection | filterBy:filterTerm:'name'">
{{ object.name }}
</li>
</ul>