How to apply filters to *ngFor?

Question

Apparently, Angular 2 will use pipes instead of filters as in Angular1 in conjunction with ng-for to filter results, although the implementation still seems to be vague, wit

Answer 1

For this requirement, I implement and publish a generic component. See

https://www.npmjs.com/package/w-ng5

For use this components, before, install this package with npm:

npm install w-ng5 --save

After, import module in app.module

...
import { PipesModule } from 'w-ng5';

In the next step, add in declare section of app.module:

imports: [
  PipesModule,
  ...
]

Sample use

Filtering simple string

  

    {{s}}
  

Filtering complex string - field 'Value' in level 2

  

    {{s.nome}} - {{s.idade}} - {{s.n1.valor1}} - {{s.n1.n2.valor2}}
  

Filtering complex string - middle field - 'Value' in level 1

  

    {{s.nome}} - {{s.idade}} - {{s.n1.valor1}} - {{s.n1.n2.valor2}}
  

Filtering complex array simple - field 'Nome' level 0

  

    {{s.nome}} - {{s.idade}} - {{s.n1.valor1}} - {{s.n1.n2.valor2}}
  

Filtering in tree fields - field 'Valor' in level 2 or 'Valor' in level 1 or 'Nome' in level 0

  

    {{s.nome}} - {{s.idade}} - {{s.n1.valor1}} - {{s.n1.n2.valor2}}
  

Filtering nonexistent field - 'Valor' in nonexistent level 3

  

    {{s.nome}} - {{s.idade}} - {{s.n1.valor1}} - {{s.n1.n2.valor2}}
  

This component work with infinite attribute level...