如何在 components.ts 文件中使用 KeyValuePipe？

Question

是否可以在 ts 文件中而不是在 html 中使用 KeyValuePipe？如果是的话，有人可以告诉我怎么做吗？这就是我现在拥有的，但显然我不能像这样使用管道。let item of this.entityDetails | keyvalue{            let properties:PropertyBase<any>[]=[                new TextboxProperty({                    key: item.key,                    label: item.key,                    value: item.value,                    required: false,                }),                ];        }

Answer 1

你当然可以。你只需要像任何服务一样导入它并注入它。你从@angular/common.

import { KeyValuePipe } from "@angular/common";

constructor(private keyValuePipe: KeyValuePipe) {

    const transformed = this.keyValuePipe.transform(this.entityDetails);

    for (let item of transformed) {

      let properties: PropertyBase<any>[] = [

        new TextboxProperty({

          key: item.key,

          label: item.key,

          value: item.value,

          required: false

        })

      ];

    }

  }

Answer 2

是的，您可以在 ts 文件中使用管道。

 constructor(public dataformatpipe: DateFormatPipe){}

ngOnInt(){}

  formatData(date) {

    return this.dataformatpipe.transform(date);

   }

html文件

 <span class="value-data">{{formatData(item.startData)}}</span>

Answer 3

在那里编写一个自定义管道，您可以在 ts 文件中写入，以便您可以转换，从父级作为管道输入传递并使用您的管道 ts 文件以供参考，请访问此处 https://alligator.io/angular/custom-pipes-angular/