如何在角度2中从组件创建和调用管道？

发布时间：2020-12-17 07:53:36 所属栏目：安全来源：网络整理

导读：我想创建一个动态管道,我将从组件中调用它. import {Component,Pipe,PipeTransform} from 'angular2/core';@Pipe({ name: 'filter',pure: false })export class filter implements PipeTransform { transform(value) { this.items1=value; this.ticket1 = []

我想创建一个动态管道,我将从组件中调用它.

import {Component,Pipe,PipeTransform} from 'angular2/core';

@Pipe({ name: 'filter',pure: false })
export class filter implements PipeTransform {
  transform(value) {
    this.items1=value;
    this.ticket1 = [];
    if (this.items1.length >0) {
      for (var i = 0; i < this.items1.length; i++) {
        this.ticket1.push(this.items1[i])
      }
    }
  }
}

我想从组件中调用此管道.

您需要在组件的pipes属性中指定它

@Component({
  pipes: [ filter ] 
})
export class MyComponent {
  (...)
}

并在您的模板中使用它：

{{someArray | filter}}
<div *ngFor="someArray | filter">(...)</div>

编辑

如果要直接在组件类中调用管道,则需要实例化它并调用其tranform方法：

@Component({
  (...)
})
export class MyComponent {
  constructor() {
    let filterPipe = new filter();
    let arr = [ ... ];
    var fiteredArr = filterPipe.transform(arr);
  }
  (...)
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!