具有不同输入的角度使用滤波器

Question

我有一个简单的名单和名字的人员列表，我希望能够在创建搜索字段或其他或两者时执行过滤器

Html如下：

<table class="table table-striped table-hover">
      <thead>
          <tr>
              <th>
                <input [(ngModel)]="searchText.nom" type="text" class="form-control" placeholder="Nom">
              </th>
              <th>
                <input [(ngModel)]="searchText.prenom" type="text" class="form-control" placeholder="Prénom">
              </th>
          </tr>
      </thead>
      <tbody>
          <tr *ngFor="let defunt of defunts | filterPersonne : searchText">
              <td>{{defunt.nom}}</td>
              <td>{{defunt.prenom}}</td>
          </tr>
      </tbody>
  </table>

我写了这个过滤器：

import { Pipe, PipeTransform } from '@angular/core';
import { DefuntSearch } from '../models/DefuntSearch';
import { Defunt } from '../models/Defunt';
@Pipe({
  name: 'filterPersonne'
})
export class FilterDefuntPipe implements PipeTransform {
  transform(items: Array<Personne>, searchText: Search):  Array<Personne> {
      items = searchText.nom ? items.filter(t => t.nom.includes(searchText.nom)) : items;
      items = searchText.prenom ? items.filter(t => t.nom.includes(searchText.prenom)) : items;
      return items;
   }
}

我的班级：

export class Search {
  constructor(
    public nom?: string,
    public prenom?: string,
  ) {

  }
}

当我为searchText键入一个字符串时，过滤器可以工作但是当searchText是对象时，过滤器不会调用searchText.nom或searchText.prenom更改。 你能救我吗？

坦克你的

Answer 1

您也可以使用

<tr *ngFor="let defunt of defunts | filterPersonne : 
                             { nom:searchText.nom, prenom:searchText.prenom }">