如何在Angular中为ngx-datatable-column传递多个管道？

Question

我想问一下您是否有任何想法如何在 Angular 中传递多个管道？

目前，我的代码只通过一个管道。

const customPipe1 = new CustomPipe2();
const customPipe2 = new CustomPipe2();

  <ngx-datatable-column
      [width]="width"
      [name]="cname"
      [prop]="cbindProperty"
      [pipe]="customPipe1">
  </ngx-datatable-column>

我想在该列中添加两个或多个管道。 像这样的普通html。

{{ birthday | customPipe1 | customPipe2 }}

Answer 1

ngx-datatable 无法做到这一点。在源码中可以看到here。

但是，您可以创建另一个执行相同操作的管道：

_{不必使用注解将其设为Pipe，因为您不会使用名称，这样您也不必将其添加到声明中}

export class ColumnPipe implements PipeTransform {
  pipes: any[] = [
    new BirthdayPipe(),
    new CustomPipe1(),
    new CustomPipe2()
  ];

  public transform(input: any): any {
    return this.pipes.reduce((output, pipe) => pipe.transform(output), input);
  }
}

您的内部管道可能需要注入一些服务。在这种情况下，您需要将管道与需要注入的管道一起添加到 providers 数组中，并将它们注入到 ColumnPipe 的构造函数中。