Angular: Как мне отфильтровать логические значения в таблице матов? - PullRequest
Новая
       83

Angular: Как мне отфильтровать логические значения в таблице матов?

0 голосов
/ 02 августа 2020

Я использую фильтр по столбцам для mat-table. Пользователь будет искать активный или неактивный, введя только эти 2 ключевых слова. В JSON active означает true, а inactive - false. Для удобства пользователя я заменил его на эти 2 слова в зависимости от условия.

img

Это мой столбец.

Typescript Code 

private columnFilter() {
  this.dataSource.filterPredicate = ((data, filter) => {
    const examCategoryName = !filter.examCategoryName || data.examCategoryName.toLowerCase().includes(filter.examCategoryName);
    const isActive = !filter.isActive || data.isActive.includes(filter.isActive);
    return examCategoryName && isActive;
  }) as (ExamCategory, string) => boolean;

  this.filter = this.fb.group({
    examCategoryName: '', isActive: ''
  });

  this.filter.valueChanges.subscribe(value => {
    const filter = {
      ...value,
      examCategoryName: value.examCategoryName.trim().toLowerCase(),
      isActive: value.isActive.trim().toLowerCase() == 'active' ? true : false
    } as string;
    this.dataSource.filter = filter;
  });
}

Проблема в том, что столбец не фильтруется. Как мне отфильтровать столбец isActive?

1 Ответ

0 голосов
/ 02 августа 2020

Попробуйте это и расскажите нам, что вы видите 

private columnFilter() {
  this.dataSource.filterPredicate = ((data, filter) => {
    const examCategoryName = !filter.examCategoryName || data.examCategoryName.toLowerCase().includes(filter.examCategoryName);
    const isActive = !filter.isActive || data.isActive.includes(filter.isActive);

//what's in these two variables? It it what you expect?
debugger;

    return examCategoryName && isActive;
  }) as (ExamCategory, string) => boolean;

  this.filter = this.fb.group({
    examCategoryName: '', isActive: ''
  });

  this.filter.valueChanges.subscribe(value => {
    const filter = {
      ...value,
      examCategoryName: value.examCategoryName.trim().toLowerCase(),
      isActive: value.isActive.trim().toLowerCase() == 'active' ? true : false
    } as string;

    //what is in filter here?
    debugger

    this.dataSource.filter = filter;
  });
}

Вы сможете использовать консоль для экспериментов с фильтрами и предикатами, чтобы получить то, что вам нужно при достижении точек останова.

Как выглядят данные для этого поля? Это просто логическое значение? Проблема, скорее всего, заключается в том, что сами данные анализируются неправильно, похоже, что синтаксический анализ предназначен для строк, а не для логического.

...