Question

这是我在组件中的数据对象

testData=[
  {
    "value": "test value with null formatter",
    "formatter": null,
  },
  {
    "value": "1234.5678",
    "formatter": "number:'3.5-5'",
  },
  {
    "value": "1.3495",
    "formatter": "currency:'USD':true:'4.2-2'",
  }
]

HTML

<div *ngFor="let data of testData">{{data.value | data.formatter}}</div>

我需要以不同的格式显示每行的数据表。

我正在使用typescript / angular4。

Answer 1

一种选择是创建自定义管道。然后，您可以将格式字符串传递到自定义管道中。您的自定义管道将解析传入的格式字符串并执行适当的格式化。

这听起来有用吗？

Answer 2

您需要创建管道。

样本（用N替换？）：

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

@Pipe({name: 'nnn'})
export class NReplacePipe implements PipeTransform {
  transform(value: string): string {
   // write your custom logic here
    let newValue = value.replace(/\?/g, 'N');
    return `${newValue}`;
  }
}

然后在你的HTML代码中使用它

<p>varName |  nnn </p>

这会改变你的输出。

在Angular（Angular 2/4）的* ngFor中动态应用格式化过滤器/管道？

2 个答案: