如何使用filterPredicate忽略空/未定义字段的筛选

Question

我正在尝试理解MatTableDataSource的filterPredicate，当我认为我很接近时，我缺少了一些逻辑。

我想通过数据源进行筛选，如果数组的值为空或"，那么它不应该对定义为"的每个值进行筛选。换句话说，用它知道的东西过滤，而不是用它不知道的东西。

如果数组的长度等于0，我尝试将值赋值为null。但即便如此也无济于事。

打字

this.registeredUserService.GetAllAdverts().subscribe(val => {
this.dataSource = new MatTableDataSource<Card>(val);
this.dataSource.paginator = this.paginator;
this.dataSource.filterPredicate = (myObject: IFilter, filterString: any) => {
let filterObj: IFilter = JSON.parse(filterString);
if (!filterObj.provinceName.includes(myObject.provinceName) ||
!filterObj.vehicleMake.includes(myObject.vehicleMake) ||
!filterObj.vehicleModel.includes(myObject.vehicleModel) ||
!filterObj.vehicleYear.includes(myObject.vehicleYear) ||
!filterObj.vehicleColor.includes(myObject.vehicleColor))
{
return false;
}
else {
return true;
}
}
filter()//whenever triggered, it should do the filtering
{
this.myFilter.provinceName = this.search.value.provinceSelector;
this.myFilter.vehicleMake = this.search.value.makeSelector;
this.myFilter.vehicleModel = this.search.value.modelSelector;
this.myFilter.vehicleColor = this.search.value.colorSelector;
this.myFilter.vehicleYear = this.search.value.yearSelector;
if (this.myFilter.provinceName.length == 0 &&
this.myFilter.vehicleMake.length == 0 &&
this.myFilter.vehicleModel.length == 0 &&
this.myFilter.vehicleColor.length == 0 &&
this.myFilter.vehicleYear.length == 0) {
this.dataSource.filter = '';
}
else {
this.dataSource.filter = JSON.stringify(this.myFilter);
}
}
myFilter: IFilter = {
provinceName: [],
vehicleMake: [],
vehicleModel: [],
vehicleColor: [],
vehicleYear: []
}
interface IFilter{
provinceName:any[],
vehicleMake:any[],
vehicleModel:any[],
vehicleColor:any[],
vehicleYear:any[]
}

它应该做什么：根据我的查询进行过滤

它的作用：只有在填充完所有值后才进行过滤。

Answer 1

您只需要在之前检查filter属性是否存在并且长度大于0，然后在对象中搜索它。

this.registeredUserService.GetAllAdverts().subscribe(val => {
this.dataSource = new MatTableDataSource<Card>(val);
this.dataSource.paginator = this.paginator;
this.dataSource.filterPredicate = (myObject: IFilter, filterString: any) => {
let filterObj: IFilter = JSON.parse(filterString);
if (
(filterObj.provinceName && filterObj.provinceName.length > 0 && !filterObj.provinceName.includes(myObject.provinceName)) ||
(filterObj.vehicleMake && filterObj.vehicleMake.length > 0 && !filterObj.vehicleMake.includes(myObject.vehicleMake)) ||
(filterObj.vehicleModel && filterObj.vehicleModel.length > 0 && !filterObj.vehicleModel.includes(myObject.vehicleModel)) ||
(filterObj.vehicleYear && filterObj.vehicleYear.length > 0 && !filterObj.vehicleYear.includes(myObject.vehicleYear)) ||
(filterObj.vehicleColor && filterObj.vehicleColor.length > 0 && !filterObj.vehicleColor.includes(myObject.vehicleColor))
) {
return false;
} else {
return true;
}
}
});