Question

我正在尝试将从API获得的数量格式化为特定于语言环境的格式。

在控制台中：

Intl.NumberFormat('en-IN').format(450000) // "4,50,000"

在Angular 2组件模板中：

{{ Intl.NumberFormat('en-IN').format(450000) }} // Cannot read property 'NumberFormat' of undefined

{{ 450000 | currency:'INR':true }} // ₹450,000.00

有没有办法让₹4,50,000.00明确指定分隔符（并且能够将语言环境字符串'en-IN'更改为'en-US'以更新）。

Answer 1

只需使用货币管道即可。假设模板中的变量名为myamount。然后只需使用

访问它

@Component({
  selector: 'currency-pipe',
  template: `<div>
    <p>Amount: {{myamount | currency:'USD':true}}</p>
  </div>`
})
export class CurrencyPipeComponent {
  myamount: number = 0.259;
}

有关货币管道的来源和更多信息：https://angular.io/docs/ts/latest/api/common/index/CurrencyPipe-pipe.html

您可能还需要设置默认文化：How to set locale in DatePipe in Angular2?

在食谱中，您可以找到有关i18n以及如何在运行时更改它的更多信息：

<script>
  // Get the locale id somehow
  document.locale = 'fr';

  // Map to the text plugin
  System.config({
    map: {
      text: 'systemjs-text-plugin.js'
    }
  });

  // Launch the app
  System.import('app').catch(function(err){ console.error(err); });
</script>

来源：https://angular.io/docs/ts/latest/cookbook/i18n.html#!#merge-with-the-jit-compiler

Answer 2

共同分割的金额：

在您的html模板中使用此代码

{{ separteAmount(450000)}}

和

在您的.ts文件中发挥作用

separteAmount(Number){
   return Intl.NumberFormat('en-IN').format(Number)
}

Angular 2货币数字格式

2 个答案: