Angular 2 Currency Pipe


Example

The currency pipe allows you to work with you data as regular numbers but display it with standard currency formatting (currency symbol, decimal places, etc.) in the view.

@Component({
  selector: 'currency-pipe',
  template: `<div>
    <p>A: {{myMoney | currency:'USD':false}}</p>
    <p>B: {{yourMoney | currency:'USD':true:'4.2-2'}}</p>
  </div>`
})
export class CurrencyPipeComponent {
  myMoney: number = 100000.653;
  yourMoney: number = 5.3495;
}

The pipe takes three optional parameters:

  • currencyCode: Allows you to specify the ISO 4217 currency code.
  • symbolDisplay: Boolean indicating whether to use the currency symbol
  • digitInfo: Allows you to specify how the decimal places should be displayed.

More documentation on the currency pipe: https://angular.io/docs/ts/latest/api/common/index/CurrencyPipe-pipe.html