我正在尝试Array
仅使用一个基于多个列过滤数据Pipe
.现在,它过滤第一列值.请检查我的下面的代码,并帮助我解决这个问题.
我的代码:
@Pipe({ name: "dataFilter", pure: false }) export class DataFilterPipe implements PipeTransform { transform(value: Array, filter: any[]) { if (!filter) { return value; } else if (value) { return value.filter(item => { for (var i = 0; i < filter.length; i++) { if (filter[i][1] == undefined) { return true; } else if ((typeof item[filter[i][0]] === 'string' || item[filter[i][0]] instanceof String) && (item[filter[i][0]].toLowerCase().indexOf(filter[i][1]) !== -1)) { return true; } return false; } }); } } }
我正在传递数据dataFilter : [['column1',value1],['column2',value2],['column3',value3]]
.
这是一个使用传递为多列过滤器的对象的解决方案.我发现传递2D数组更方便:
@Pipe({
name: 'filter'
})
export class FilterPipe implements PipeTransform {
transform(items: Array, filter: {[key: string]: any }): Array {
return items.filter(item => {
let notMatchingField = Object.keys(filter)
.find(key => item[key] !== filter[key]);
return !notMatchingField; // true if matches all fields
});
}
}
拥有包含多列的对象数组:
this.people = [ {name: 'John', age: 27, sex: 'male'}, {name: 'Lara', age: 21, sex: 'female'}, {name: 'Rick', age: 29, sex: 'male'}, {name: 'Eva', age: 27, sex: 'female'}, {name: 'Mike', age: 27, sex: 'male'} ];
还有一个过滤器:
this.peopleFilter = {age: 27, sex: 'male'};
使用它像:
结果,两个人符合我们的标准:John和Mike.
这是工作的plunker:多列过滤管道演示.