我正在尝试过滤角材料2数据源表,以映射它对应于数据表中的正确搜索输入模型。例如,我有要传递的过滤器对象以匹配表的列。
用户输入的FilterObject:
{ description: "", manufacturer: "", unit: "" }
返回代码的功能
this.ItemService.GetItems(false).subscribe((res) => {
// storing the data to display in the table, data is displayed in the view
this.dataSource = new MatTableDataSource<Item>(res);
// pushing form data to this observable to keep track of
const ItemsFilter$ = [];
for(let key in this.ItemModel) {
ItemsFilter$.push(this.MultipleSearchFilterFormGroup.get(key).valueChanges.debounceTime(150).distinctUntilChanged().startWith(''));
}
// combine ItemsFilter$ data array and merge it to the data array model then in subscribe the FilterObject you see as { description: "", manufacturer: "", unit: "" }. With the values you typed in.
Observable.combineLatest(ItemsFilter$)
.map((res) => this.mapToDataModel(res, this.ItemModel))
.subscribe(FilterModel => {
// I have use to filter the property but this only allows me to filter one only and not multiple while typing into the input fields.
this.dataSource.filterPredicate = (data: any, filter: any) => (data.description.indexOf(filter.description.toString()) !== -1);
this.dataSoruce.filter = filter;
});
setTimeout(() => {
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
});
});