Angular 2货币数字格式

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

您可能还需要设置默认文化:如何在Angular2中的DatePipe中设置区域设置？

在食谱中,您可以找到有关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