сделать динамический фильтр в Angular - PullRequest
0 голосов
/ 07 ноября 2018

У меня есть труба, которую можно повторно использовать в компонентах. Обычно при поиске.

HTML выглядит следующим образом, и вы можете видеть, что у меня есть массив с «plantNumber» и «shortDescription», но это может быть бесконечный список свойств

*ngFor="let workOrder of workOrders | filterArrayPipe: ['plantNumber', 'shortDescription']: searchFilter"

Фильтр выглядит так

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'filterArrayPipe'
})
export class FilterArrayPipe implements PipeTransform {
  transform(value: any, config: any, q: string) {
    if (config && q) {
      return value.filter(result => {
        return result[config[0]].toString().toLowerCase().indexOf(q) > -1 
          || result[config[1]].toString().toLowerCase().indexOf(q) > -1;
      });
    } else {
      return value;
    }
  }
}

Но мне бы хотелось, чтобы это выглядело больше так

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'filterArrayPipe'
})
export class FilterArrayPipe implements PipeTransform {
  transform(value: any, config: any, q: string) {
    if (config && q) {
      return value.filter(result => {
        for (let i = 0; i < config.length; i ++) {
          const type = config[i];
          return result[type].toString().toLowerCase().indexOf(q) > -1;
        }
      });
    } else {
      return value;
    }
  }
}

Итак, вопрос в том, как бы я добавил "и" || в операторе возврата?

1 Ответ

0 голосов
/ 07 ноября 2018

Из-за возврата в этот цикл for он будет проверять только первый элемент config.

Вместо этого вы можете сделать что-то вроде:

  return value.filter(result => {
    for (let i = 0; i < config.length; i ++) {
      const type = config[i];
      if (result[type].toString().toLowerCase().indexOf(q) > -1) {
        return true;
      }
    }
    return false;
  });

Таким образом, он будет проверять каждое значение в массиве config и возвращать false, только если не найдет совпадение.

Альтернативно, с помощью функции some вы можете сделать что-то вроде:

  return value.filter(result => {
    return config.some((type) => result[type].toString().toLowerCase().indexOf(q) > -1)
  });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...