Trying to create a filter in angular2, I have constructed an array of products as shown below:
private items = ["Apple", "Banana", "Orange"];Below is the code for my filter pipe:
import {Pipe} from 'angular2/core';
@Pipe({name:'filter'})
export class FilterPipe {
transform(value, args) {
if(!args[0]){
return value;
}
else if (value) {
return value.filter(item => {
for (let key in item){
if((typeof item[key]==='string' || item[key] instanceof String) && (item[key].indexOf(args[0]) !== -1)){
return true;
}
}
});
}
}
}
Incorporated an ul element in my component to display the products, along with an input element to facilitate filtering:
<input type="text" [(ngModel)]="filterInput">
<ul>
<li *ngFor="#item of items | filter: filterInput">
{{item}}
</li>
</ul>
The issue I am facing with this implementation is that the filter only works correctly when entering the first letter. Upon entering additional letters, the filter stops functioning properly. Any insights on how to resolve this?