如何从 angular 中的组件使用 DecimalPipe？

Question

我有一个要求，我必须使用来自 ts

的小数管道转换数字

而不是像这样使用十进制管道

<td>{{rmanFmvRulesDef.max  | number :'1.2-2'}}</td>

我想从组件中操作它，有人可以帮我吗？

Answer 1

或者，如您在 Stackblitz 中看到的示例，您可以使用 accounting.

只需拨打电话：element.price = format.formatCurrency(element.price);

定义助手后。您可以通过以下方式定义： <h2 *ngFor="let item of item">{{ item.price }}</h2> 例如。

组件：

import { accounting } from 'accounting';

export function formatCurrency(value) {
    return accounting.formatMoney(value, '', 0, ' ', '.');
}

export function unformatCurrency(value) {
    return accounting.unformat(value);
}

注意：return accounting.formatMoney(value, '', 0, ' ', '.');您可以使用您想要的任何拆分器更改 ' ' 和 . , 或 space。对于小数点后的位数，您可以将 0 数字更新为您想要的位数。

Answer 2

像往常一样在 angular 你可以依赖 DI。可以覆盖ts中的transform函数。

import { DecimalPipe } from '@angular/common';

class MyService {
  constructor(private _decimalPipe: DecimalPipe) {}

  transformDecimal(num) {
    return this._decimalPipe.transform(num, '1.2-2');
  }
}

在提供者数组中添加 DecimalPipe 否则会报错

providers: [DecimalPipe,...]

Answer 3

您也可以使用 formatNumber 函数（DecimalPipe 在后台使用它）。无需处理 DI 或向提供程序数组添加任何内容。

如何从 angular 中的组件使用 DecimalPipe？

How to use DecimalPipe from component in angular?

pipe

angular-pipe

angular

angular7