CurrencyPipe

pipe

npm Package	@angular/common
Module	import { CurrencyPipe } from '@angular/common';
Source	common/src/pipes/number_pipe.ts
NgModule	CommonModule

How To Use

number_expression | currency[:currencyCode[:display[:digitInfo[:locale]]]]

Description

Use currency to format a number as currency.

• currencyCode is the ISO 4217 currency code, such as USD for the US dollar and EUR for the euro.

• display indicates whether to show the currency symbol or the code.

  • code: use code (e.g. USD).
  • symbol(default): use symbol (e.g. $).
  • symbol-narrow: some countries have two symbols for their currency, one regular and one narrow (e.g. the canadian dollar CAD has the symbol CA$ and the symbol-narrow $).
  • boolean (deprecated from v5): true for symbol and false for code If there is no narrow symbol for the chosen currency, the regular symbol will be used.
• digitInfo See DecimalPipe for detailed description.
• locale is a string defining the locale to use (uses the current LOCALE_ID by default)

Example

@Component({
  selector: 'currency-pipe',
  template: `<div>
    <!--output '$0.259'-->
    <p>A: {{a | currency}}</p>

    <!--output 'CA$0.26'-->
    <p>A: {{a | currency:'CAD'}}</p>

    <!--output 'CAD0.26'-->
    <p>A: {{a | currency:'CAD':'code'}}</p>

    <!--output 'CA$0,001.35'-->
    <p>B: {{b | currency:'CAD':'symbol':'4.2-2'}}</p>

    <!--output '$0,001.35'-->
    <p>B: {{b | currency:'CAD':'symbol-narrow':'4.2-2'}}</p>

    <!--output '0 001,35 CA$'-->
    <p>B: {{b | currency:'CAD':'symbol':'4.2-2':'fr'}}</p>
  </div>`
})
export class CurrencyPipeComponent {
  a: number = 0.259;
  b: number = 1.3495;
}