Question

我正在尝试使用管道来过滤我的列表我没有预料到。我不知道如何将input字段值发送到管道。

这是我的代码

https://plnkr.co/edit/WFMo8Az7BSJaRJAVVxyE?p=preview 当我输入“a”时，它应该只显示列表中的“abc”

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


@Pipe({ name: 'listpipe' })
export class ListPipe implements PipeTransform {
  transform(items: any[], filter: string) {
     if (!items || !filter) {
            return items;
        }
  return items.filter(item => item.name.indexOf(filter) !== -1);
  }
}

Answer 1

您忘记将值字符串（输入文本的值）传递给过滤器。

所以在组件类中，它应该是：

<li *ngFor="let l of v  | listpipe:values">{{l.name}}</li>

而不是：

<li *ngFor="let l of v  | listpipe">{{l.name}}</li>

您可以在官方文档中找到有关管道参数的更多信息：https://angular.io/docs/ts/latest/guide/pipes.html#parameterizing-a-pipe

如何使用管道过滤角度2中的列表？

1 个答案: