I've created custom pipe to filter my data from database
There is pipe
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'filter'
})
export class FilterPipe implements PipeTransform {
transform(aliases: any, term: any): any {
// check if search term is undefined
if (term === undefined) return aliases;
// return updated array
return aliases.filter(function(alias){
return alias.local_part.includes(term) || alias.domain.includes(term);
});
}
}
and there is my search input
<form id="filter">
<div class="input-group custom-search-form">
<input type="text" placeholder="Search" class="form-control" [(ngModel)]="term" name="filter">
<span class="input-group-btn">
<button class="btn btn-primary" type="button">
<i class="fa fa-search"></i>
</button>
</span>
</div>
</form>
it works fine but I have in my database records like aaa,Abb,AbbB,cCc.
And when I am typing something into search input it return only elements where is lower cases or upper.
For example: search -> aaa return aaa but not AaA and Aaa
How should I change it to achieve it?
Change your pipe as given below
private transform(aliases: any, term: any): any {
let filter;
let newValue;
// check if search term is undefined
if (term === undefined) {
return aliases;
} else if (term) {
filter = term.toLocaleLowerCase();
}
if (filter && aliases) {
newValue = aliases.filter((alias) => alias.local_part.toLocaleLowerCase().indexOf(filter) !== -1 || alias.domain.toLocaleLowerCase().indexOf(filter) !== -1);
} else {
newValue = aliases;
}
// return updated array
return newValue;
}