我的项目中有一个有效的搜索管道。它应用在桌子上。表有很多列,如产品名称、类别、数量等。管道搜索所有字段并过滤结果。它区分大小写,我想让它不区分大小写。如果我输入Mobile
它会显示结果,但如果我输入mobile
它不会显示结果。
搜索.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
import {isObject} from "rxjs/util/isObject";
import {isEmpty} from "rxjs/operator/isEmpty";
import {empty} from "rxjs/Observer";
@Pipe({
name: 'search'
})
export class SearchPipe implements PipeTransform
{
transform(input, searchString)
{
if (input == null) return input;
return input.filter(this.compareWithAllFields, searchString);
}
compareWithAllFields(value, index)
{
var fields = Object.keys(value);
for (let i = 0; i < fields.length; i++)
{
if (value[fields[i]] != null)
{
if (isObject(value[fields[i]]))
{
var childFields = Object.keys(value[fields[i]]);
if (childFields.length > 0)
{
for (let j = 0; j < childFields.length; j++)
{
if ((value[fields[i]][childFields[j]] + "").indexOf(this.toString()) !== -1)
{
return true;
}
}
}
}
if ((value[fields[i]] + "").indexOf(this.toString()) !== -1)
{
return true;
}
}
}
return false;
}
}
输入表格
<input placeholder="Enter Product Details to Search" class="form-control input-lg" type="text" #searchProduct
(keyup)="0">
用法
<tr *ngFor="let product of products | search:searchProduct.value;let serial = index">