Фильтровать по нескольким значениям (Angular 2/7, TypeScript) - PullRequest
1 голос
/ 17 мая 2019

Я не могу отфильтровать "listProduct" по нескольким значениям.Как фильтровать по нескольким значениям?

Я пробовал писать после через запятую, но не работает.Я не нашел решения в "Google".

searchFilter = () => {
    this.listProducts = this.listProductsOrigin.filter(e =>
      e.name.toLocaleLowerCase().includes(this.searchValue.toLocaleLowerCase())
    );

    this.loading = false;
    // tslint:disable-next-line: semicolon
  };

Я пытался сделать это:

searchFilter = () => {
    this.listProducts = this.listProductsOrigin.filter(e =>
      e.name.toLocaleLowerCase().includes(this.searchValue.toLocaleLowerCase()),
e.description.toLocaleLowerCase().includes(this.searchValueDesc.toLocaleLowerCase())
    );

    this.loading = false;
    // tslint:disable-next-line: semicolon
  };

, но не работает.

Ответы [ 2 ]

0 голосов
/ 17 мая 2019

Компилятор машинописного текста должен предупреждать вас о вашей попытке решения. Метод filter() принимает функцию, которая возвращает значение bool, так что вы, вероятно, хотите что-то вроде этого:

this.listProducts = this.listProductsOrigin.filter(e =>
      e.name.toLocaleLowerCase().includes(this.searchValue.toLocaleLowerCase()) || e.description.toLocaleLowerCase().includes(this.searchValueDesc.toLocaleLowerCase())
    );

или, может быть:

this.listProducts = this.listProductsOrigin.filter(e =>
      e.name.toLocaleLowerCase().includes(this.searchValue.toLocaleLowerCase()) && e.description.toLocaleLowerCase().includes(this.searchValueDesc.toLocaleLowerCase())
    );

в зависимости от того, хотите ли вы объединить предложения фильтра с операцией И или ИЛИ

0 голосов
/ 17 мая 2019

Попробуйте:

searchFilter = () => {
    this.listProducts = this.listProductsOrigin.filter(e =>
      e.name.toLocaleLowerCase().includes(this.searchValue.toLocaleLowerCase()) 
      || e.description.toLocaleLowerCase().includes(this.searchValueDesc.toLocaleLowerCase())
    );
    this.loading = false;
    // tslint:disable-next-line: semicolon
};
...