如何在Angular 5中应用自定义管道进行过滤

Question

我正在开发MEAN Stack应用，我要显示的是所有用户，然后当用户输入input字段时，它会过滤用户

这是我创建的自定义管道

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
  name: 'filter'
})
export class FilterPipe implements PipeTransform {
  constructor(){}

  transform( users: any, term: any ): any {
    if(term === undefined) return users;
    return users.filter(function(user){
      return user.username.toLowerCase().includes(term.toLowerCase());
    })
  }

}

我所做的只是将管道导入component.ts

import { FilterPipe } from '../../filter.pipe';

然后在component.html中，添加input字段，用户将在其中写入内容以过滤用户

<div class="inputWithIcon">
    <form>
      <input type="text" placeholder="Search.." [(ngModel)]="term" >
      <i class="fa fa-search fa-lg fa-fw" aria-hidden="true"></i>
    </form>
  </div>

然后我添加ngFor

<ul class="list-group">
      <li  *ngFor="let user of userData | filter:term" class="list-group-item" >
          <a [routerLink]="['/my-courses/', user.username]" >{{ user.username }}</a>
        </li>
      </ul>

但这没用