Angular material table: How to always activate filtering even without filter set?

Question

I have an angular material table with a custom filtering:


ngOnInit(): void {
  this.dataSource.filterPredicate = (u: Underlying, f: string) => 
    this.activeUnderlyings.indexOf(u.symbol) > 0
    && defaultFilter(u, f);
}

applyFilter(event: Event) {
  const filterValue = (event.target as HTMLInputElement).value;
  this.dataSource.filter = filterValue.trim().toLowerCase();
}

No matter what filter word is set or if it's not set at all, the items should always be filtered by this.activeUnderlyings.indexOf(u.symbol) > 0. However, the filtering is obviously only triggered, when this.dataSource.filter is set.

Is there a way to manually activate filtering?

talhature talhature · Accepted Answer · 2020-06-14T22:25:43

For the datasource to be able to filter the dataset accordingly, a filter value is mandatory. You can call applyFilter method explicitly whereever you need if you want to trigger manually.

You can also check mat-table-filter for any filtering requirements. It saves you from implementing such filtering boilerplate.

Angular material table: How to always activate filtering even without filter set?

1 Answers