角 2 中的数千个分隔符

Question

我已经在我的项目中尝试过这个：

<div padding *ngIf="TotalAPagar">
    $ {{TotalAPagar | number }}  
</div>

我的变量叫做 TotalAPagar ，我使用的是数字管道，但它显示的值是这样的 1,000,500。

我需要将编号约定更改为dots.例如。1.000.000

我一直在 angular 文档中阅读，但没有任何示例。

Answer 1

我认为有两种

方法可以解决此问题：

---

1. 您可以尝试从@angular/公共库中覆盖十进制管道：

这样：

point-replacer.pipe.ts

import { Pipe } from '@angular/core';
import {DecimalPipe} from "@angular/common";
@Pipe({
    name: 'pointReplacer'
})
export class PointReplacerPipe extends DecimalPipe {
  transform(value: any, digits?: string): string {
        return super.transform(value, digits).replace(',', '.');

    }
}

在您的 HTML 代码中：

<div padding *ngIf="TotalAPagar">
    $ {{TotalAPagar | pointReplacer }}  
</div>

---

2.您可以编写自己的管道，替换字符并在html代码中使用**双管道**

尝试这样：

point-replacer.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
    name: 'pointReplacer'
})
export class PointReplacerPipe implements PipeTransform {
    transform(value: string, args: any[]): string {
        if(value) {
          return value.replace(',', '.');
        }
        return '';
    }
}

在您的 HTML 代码中：

<div padding *ngIf="TotalAPagar">
    $ {{TotalAPagar | number | pointReplacer }}  
</div>

---

无论你选择哪种方法，不要忘记在模块中声明你自己的管道，你使用它：

@NgModule({
  declarations: [PointReplacerPipe],
  providers: [PointReplacerPipe]
}) 

Answer 2

在阅读了有关角度 js y javascript 的论坛和文档后，我发现了一个将数字放在格式和货币中的方法，该方法是 toLocaleString((，是 javascript 中的一种方法，有助于将其放入您需要的货币或语言中。

我

使用该方法搜索我需要的国家/地区名称，并向我显示所需的信息。(http://www.localeplanet.com/icu/es-CO/(，就我而言，是哥伦比亚。

在我的函数中，我只需要将 .toLocaleString('es-CO'( 添加到结果中，并将值与指定的货币放在一起。

例如：

这。总阿加尔 = (this.calcularDescuentosLiquidacion(this.TotalDevengadoValor， this.sueldoPendientePorCancelarValor， this.item.libranza， this.item.prestamo_empleado(+ this.calcularIndemnizacion(this.item.promedio_salario， this.item.fecha_fin_contrato， this.item.fecha_inicio_contrato((.toLocaleString('es-CO'(;

Answer 3

我认为这是一个更干净的解决方案：

在应用程序模块中导入LOCALE_ID

import {ErrorHandler, NgModule, LOCALE_ID} from '@angular/core';

并在提供程序中定义如下：

  providers: [
    PouchServiceProvider,
    DbProvider, {
      provide: LOCALE_ID,
      useValue: "nl-NL"
    }
  ]

这将根据local_id自动选择分隔符 ID