Поиск в списке в списке с угловой трубой 2 - PullRequest
0 голосов
/ 25 декабря 2018

У меня проблема с возвратом списка при передаче параметра.Этот поиск я пытаюсь отфильтровать из списка, который находится внутри другого списка.Если я передаю в качестве поля поле из «внешнего» списка, возврат работает нормально.Но я не могу отфильтровать элементы списка внутри.У меня есть список сотрудников, где я пытаюсь отфильтровать людей по имеющимся у них навыкам.Если я ищу имя, например, оно работает, но я должен искать описание его навыков.Например: я передаю в качестве параметра "json", и метод возвращает сотрудников, имеющих навыки Json.Может кто-то помочь мне, пожалуйста?Спасибо.

certification: (3) [{…}, {…}, {…}]
gcm: 1
id_employee: 9
manager: "te"
name: "teste t"
project: {id_project: 2, name: "B3", customer: "Ibovespa", 
valueOfProject: 100000, dtBegin: "2018-07-20T03:00:00.000+0000", …}
role: "tete"
salary: 1234
skill: Array(3)
0: {id_skill: 8, descricao: null}
1:
  descricao: "json"
  id_skill: 9
  __proto__: Object
2: {id_skill: 10, descricao: "js"}
length: 3
__proto__: Array(0)
__proto__: Object
length: 5
__proto__: Array(0)
export class SearchFilterPipe implements PipeTransform {
transform(items: any[], field: string, value: string): any[] {
if (!items) return [];
return items.filter(it => it[field] == value);
}

1 Ответ

0 голосов
/ 25 декабря 2018

Multi args pipe объявлен с args: any[], вот так:

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

@Pipe({
  name: 'searchFilter'
})
export class SearchFilterPipe implements PipeTransform {
  transform(items: any[], args: any[]): any[] {
    if (!items) return [];
    return items.filter(it => it[args[0]] == args[1]);
  }
}

И используйте это как *ngFor="let skillItem of skill | searchFilter: ['descricao', 'json']" любым html способом, который вы хотите, что-то вроде:

<table>
  <thead>
    <th>ID</th>
    <th>Descricao</th>
  </thead>
  <tbody>
    <tr *ngFor="let skillItem of skill | searchFilter: ['descricao', 'json']">
      <td>{{skillItem.id_skill}}</td>
      <td>{{skillItem.descricao}}</td>
    </tr>
  </tbody>
</table>

Создан StackBlitz DEMO , чтобы вы могли увидеть полный рабочий пример.

...