Несколько фильтров с угловыми материалами

Question

Я работаю над угловым 8 проектом, используя угловые материалы для укладки. Я использовал таблицу матов с фильтрами для фильтрации данных из таблицы матов. Фильтр таблицы матов по умолчанию фильтрует данные, содержащие введенные символы. Но я хочу использовать два фильтра одновременно с mat-table, то есть фильтр по умолчанию и фильтр по домену (столбец из таблицы), который будет фильтроваться с использованием раскрывающегося списка. После исследования я обнаружил, что могу фильтровать данные, используя столбцы, определив filterPredicate, в котором для фильтрации используется столбец, но есть ли способ использовать фильтр по умолчанию и фильтр столбцов одновременно?

Ниже приведен мой код фильтрасо скриншотами

applyFilter(filterValue: string) {
    if (this.search) {
      this.domainSelect = '';
    }
    this.dataSource.filter = filterValue.trim().toLowerCase();
  }

 // Below method is in complete and will be implemented for Domain Filter

  applyDomainFilter(filterValue: string) {
    filterValue = filterValue.trim().toLowerCase(); 
    this.dataSource.filter = filterValue;
  }

Спасибо

Answer 1

Я всегда использую один метод для установки нескольких фильтров, определяемых типом string.

applyFilter(value: any, type: string) {
  switch(type) {
    case 'name':
      this.filterObject.name = value;
      break;
    case 'domain':
      this.filterObject.domain = value;
      break;
    default:
      break;
  }
  this.dataSource.filter = JSON.stringify(this.filterObject);
}

В моем предикате фильтра вы можете решить, хотите ли вы соответствовать точно всем или хотя бы одному фильтру. Я всегда объединяю свои фильтры с логическим AND.

this.dataSource.filterPredicate = (obj, filterStr) => {
  let filterObj = JSON.parse(filterStr);
  if(obj.name.toLowerCase().includes(filterObj.name.toLowerCase()) && obj.domain.toLowerCase().includes(filterObj.domain.toLowerCase())) {
    return true;
  } else {
    return false;
  }
}