Question

我创建了一个Pipe，目的是根据标签列表过滤列表。

@Pipe({
  name: "tagfilter"
})
export class TagFilterPipe implements PipeTransform {
    transform(items: Event[], args: any[]) :any {
    if (args.length === 0) {
      return items;
    }
    return _.filter(items, (item: any) => {
            return (_.intersection(item.tags, args[0]).length > 0)
        });
    }
}

我正在使用它：

<tbody class="myline" *ngFor="#event of chapter.events | tagfilter:selectedTags" [event]="event">

然而，＆＃34; selectedTags＆＃34;是一个字符串数组，如果我从这个数组中添加或删除条目，它不会触发过滤器，因此，我的列表不会被过滤：/

Answer 1

我认为改变检测在Angular2中是如何工作的。我的意思是对象内的更新不会触发更改检测，但是如果你更新整个引用，它就会发生。

要重新评估管道，您需要使用新管道替换该阵列：

@Component({
  selector: 'my-app', 
  template: `
    <div>
      <span *ngFor="#l of (list | sort:excluded)">{{l}}</span>
    </div>
    <div (click)="updateArgs()">Update args</div>
  `,
  pipes: [ SortPipe ]
})
export class AppComponent {
  constructor() {
    this.list = [ 'n', 'g', 'a', 'u', 'r', 'l' ];
  }

  updateArgs(array) {
    this.excluded = [ 'n', 'g' ];
  }
}

在我的示例中，执行updateArgs时，再次调用管道的transform方法。

这是一个傻瓜：https://plnkr.co/edit/GWcEOeY0koXZ5vroRntV?p=preview。

希望它可以帮到你，亨利

如何在Angular2中将数组作为arg传递给Pipe

1 个答案: