Use of Currency Pipe in Angular

cover-photo

Use of Currency Pipe in Angular

In this blog post, we’ll learn about Angular Currency Pipe. We all know how much we struggle for making a number format precise when we have to show currency based on the country and their respective currencies. Currency Pipe Angular is easier to use module for displaying Currencies around the world. Currency Pipe in Angular is simple, robust, inbuilt feature to show currencies with different formats and fractions.

If we don't use currency pipe in angular, we will have to add an appropriate currency icon and show commas separated values with 2 decimal fixed values. We have to run the Pricing number through certain functions and write code to add commas and currency icons.

Angular here makes it handy by providing a Built in Mechanism that we all know is Pipes which is used for formatting data. Angular has a bunch of pipes currency pipe angular is one of them. Angular has a Currency Pipe built in we just have to use it according to our needs.

blog-photo

CurrencyPipe is an API provided by angular. It is part of the angular CommonModule.

It transforms a number to a currency string, according to locale rules that determine sizing, separator, decimal-point characters, and other locale-specific configurations.


Syntax of Currency Pipe Angular

{{ value_expression | currency [ : currencyCode [ : display [ : digitsInfo [ : locale ] ] ] ] }}


Example:

//app.component.ts
price: number = 10050.4521;


//app.component.html
{{ price | currency }} //output $10,050.45


This is the basic method of using a currency pipe, the default Currency code for this pipe is 'USD'. But this default is Deprecated from Angular version 9. But you can still set it as default by providing as providers for this pipe as follows:

{provide: DEFAULT_CURRENCY_CODE, useValue: 'USD'}


There are other examples as well which you could use according to your needs and configurations

<!--app.component.ts-->

a: number = 0.259;
b: number = 1.3495;


<!--app.component.html-->

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

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

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

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

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

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

<p>B: {{b | currency:'CLP'}}</p>
<!--output 'CLP1' because CLP has no cents-->


Angular Currency Pipe without symbol

If you want to show numbers in currency format without the symbol, or you want to use a currency pipe without a symbol use the below format.

<p> {{ b | currency:'USD':'' }} </p>


<!--output 1.35 -->


There is a simple code snippet as well for the above Implementation Currency pipe angular without symbol

Few countries like Canada have two currency codes like symbol CA$ and symbol-narrow $. If the country locale does not have symbol-narrow, default symbol will be displayed.

Indian rupee does not have symbol-narrow so the default rupee symbol displayed.

If you want to display your own custom name as symbol you can pass as a parameter as shown in below example.I am passing ‘Indian Rupee’ as display parameter.

<!--output 'INR100.23'-->
<p>{{Value | currency:'INR':'code'}}</p>

<!--output 'CA$100.23'-->
<p>{{Value | currency:'CAD':'symbol'}}</p>

<!--output '$100.23'-->
<p>{{Value |currency:'CAD':'symbol-narrow'}}</p>

<!--output '₹100.23'-->
<p>{{Value |currency:'INR':'symbol-narrow'}}</p>

<!--output 'Indian Rupee100.23'-->
<p>{{Value | currency:'INR':'Indian Rupee'}}</p>


Angular Currency Pipe INR

If you want to show currency in Indian rupees, Use angular currency pipe INR.

<p> {{ b | currency:'INR' }} </p>

<!--output ₹1.35 -->


Angular Currency pipe without decimal

Use angular currency pipe without a decimal point with this format

<p> {{ b | currency:'USD':true:'1.0-0' }} </p>

<!--output $1 -->


If you want to show currency without decimal points, using an angular currency pipe without decimal points won't work you should use the number pipe instead, if you need just numbers use this below format.

<p> {{ b | number:'1.0-0' }} </p>

<!--output 1 -->


Angular Currency pipe in component

Below is the code to use the angular currency pipe in the component. You have to import it and pass it into with providers inject it via the constructor and it's ready to use.

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { CurrencyPipe  } from '@angular/common';
import { AppComponent } from './app.component';

@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ],
  providers:    [ CurrencyPipe ]
})

export class AppModule { }

app.component.ts

import { Component } from '@angular/core';
import { CurrencyPipe } from '@angular/common';

@Component({
  selector'my-app',
  templateUrl'./app.component.html',
  styleUrls: [ './app.component.css' ]
})

export class AppComponent  {
  priceString:String = '100';
  price:any;

  constructor(private currencyPipe:CurrencyPipe){
    this.price = this.currencyPipe.transform(this.priceString);
  }
  
}

app.component.html

<p> This is angular currency pipe used in component {{price}} </p>


<!--output This is angular currency pipe used in component $100.00 -->


blog-photo


List of currencies with output for Currency Pipe Angular

Here’s the list of currencies for the output of this input

//html
{{number1 |currency:item.key:'symbol'}}.


//ts
number1 = 100


Display Currency symbol to the right using Angular Currency Pipe

Many European nations make use of the currency symbol to the right of the currency value (France, Germany, Spain, Italy countries).

The symbol will automatically be displayed at the right side of the value if you pass the locale information, as demonstrated in the French locale above.

However, the remaining currencies that lack a locality continue to just display the currency symbol to the left.

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


@NgModule({
 providers: [{
  provide: LOCALE_ID,
  useValue: 'fr' // 'de' for Germany, 'fr' for France ...
 }]
})


Import LOCALE_ID from ‘@angular/core’ and pass it to the provides as shown above.

However, this will alter the application's locale overall. Therefore, only if your site uses single locale information is this strategy appropriate.

And only local information should be used to decide whether to display the currency sign to the left or right.

Therefore, whenever necessary, it is preferable to give locale information to the Angular Currency Pipe.

Currency Pipe Angular FAQ

Below are some most popular frequently asked questions regarding the currency pipe angular.


What is Currency Pipe in Angular

Angular Currency Pipe is one of the built in pipes in Angular used to format currency value according to given country code, currency, decimal, locale information.

What is Angular Currency Pipe Syntax?

{{ value_expression | currency [ :currencyCode [ :display [ : digitsInfo [ : locale ] ]]] }}
  • value_expression: the number to be formatted as a currency.
  • currency: A pipe keyword that is used with a pipe operator.
  • currencyCode: The currency code, i.e USD for US dollar or EUR for the Euro.
  • digitsInfo : Format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}.
  • locale : A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default.

How to add CurrencyPipe in TypeScript File

Below is the code to use the angular currency pipe in component. You have to import it and pass it into with providers inject it via constructor and its ready to use.

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { CurrencyPipe  } from '@angular/common';
import { AppComponent } from './app.component';

@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ],
  providers:    [ CurrencyPipe ]
})

export class AppModule { }


app.component.ts

import { Component } from '@angular/core';
import { CurrencyPipe } from '@angular/common';

@Component({
  selector'my-app',
  templateUrl'./app.component.html',
  styleUrls: [ './app.component.css' ]
})

export class AppComponent  {
  priceString:String = '100';
  price:any;

  constructor(private currencyPipe:CurrencyPipe){
    this.price = this.currencyPipe.transform(this.priceString);
  }
  
}

There are different ways in which you can use this currency pipe. You can use it in Html file or your component file as well. You can also check this small snippet for implementing Currency pipe in Typescript 


Currency Pipe Angular Basic Format

<p>A: {{a | currency}}</p>


What is the default value of symbol display while using the currency pipe angular

{{ price | currency }} //output $10,050.45

This is the basic method of using a currency pipe, the default Currency code for this pipe is 'USD'. But this default is Deprecated from Angular version 9. But you can still set it as default by providing as providers for this pipe as follows:

{provide: DEFAULT_CURRENCY_CODE, useValue: 'USD'}


How do you use currency pipe angular in input type?

<input type="text" value="">


Angular Currency Pipe with Currency Code Syntax

{{number1 | currency:'CAD'}}


Angular Currency Pipe Remove Decimal(No Decimal)

Below is the basic example for using currency pipe without Decimal

{{number1 | currency:'USD':'symbol':'4.0'}}

This is useful when you don’t want to display cents in amount. (Angular Currency pipe no cents)

If you want to customise the decimal points of currency value. You need to pass digitInfo parameter. The syntax of the digitInfo parameter is “numberOfInteger:minimumFractions-maxFractions”.

<!--output '₹0,100.35'-->
<p>{{Value |currency:'INR':'symbol':'4.2-2'}}</p>

<!--output '₹100.2'-->
<p>{{Value |currency:'INR':'symbol':'3.1-1'}}</p>


The first example displayed as “₹0,100.35” because we are telling the currency pipe to display at least 4 digits. Remaining one digit adjusted with 0.

And after the decimal point minimum 2 fractions and maximum 2 fractions are displayed.

In the second example I am passing fractions as ‘1-1’. So it displayed as “₹100.2”.

Angular Currency Pipe by default displays two decimal points irrespective of currency type. If currency is 100.

<!--₹100.00-->

<p>{{IntegerValue |currency:'INR':'symbol'}}</p>


To remove decimal points from the Angular currency pipe, we need to pass digitInfo parameter fractions as zero.

<!--₹100-->

<p>{{IntegerValue |currency:'INR':'symbol':'3.0'}}</p>


Few country currencies does not support cent values in that case decimal points are truncated. For example Chilean peso Currency CLP does not support cents. So if the currency value is 100.23. It is displayed as 100.


You can see the below table for list of such countries in below article.

Angular Decimal Pipe

Angular Currency Pipe INR

{{number1 | currency:'INR':'symbol'}}

//Output: ₹1,980.00


Angular Currency Pipe example with locale

An area where a specific language or language variety is spoken is known as a locale. Regions that could be considered include nations and geographic areas. Angular pipe can be used by passing locale value as well using below method

<p>
  {{Value | currency:'CAD':'symbol':'4.2-2':'fr'}}
</p>


But the above code returns the error in console saying Missing locale data for the locale “fr”.

We are passing french locale information as “fr”. But in our application we don't have locale information for french.

We need to register the locale information.

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';


registerLocaleData(localeFr, 'fr');


Follow the below steps to use Angular Currency Pipe with locale.

  1. Import the registerLocaleData from @angular/common
  2. Import locale Information from @angular/common/locales/fr.
  3. And Finally register the information using registerLocaleData method.
<!--output '0 100,23 $CA'-->
<p>{{Value | currency:'CAD':'symbol':'4.2-2':'fr'}}</p>


<!--output '100,23 $CA'-->
<p>{{Value | currency:'CAD':'symbol':'3.2-2':'fr'}}</p>


Creating Custom Angular Currency Pipe

Angular provides a way to create custom pipes using this feature we can create our own custom currency pipe. We might want different parameters in Currency Pipe like default currency code, symbol, decimal, locations and locale?

Lets consider we have a fixed currency format across the application as shown below.

{{ Value | currency:'EUR':'symbol':'3.2-2':'fr' }}

//100,23 €


To save efforts of passing these parameter always when you use the currency pipe, we can set the above shown parameters as default parameters so that it displays every time the same output as shown above.

{{ Value | currency }}

//100,23 €


Actually Angular does not provide any way to set or change the default parameters to the Currency Pipe. But we can create an custom Angular currency Pipe to achieve this.

Let's create a new file called mycurrencypipe.currencypipe.ts file and add the code as shown below. We can change the parameters as per our needs.

import { formatCurrency, getCurrencySymbol } from '@angular/common';


@Pipe({
  name: 'mycurrency',
})


export class MycurrencyPipe implements PipeTransform {
  transform(
    value: number,
    currencyCode: string = 'EUR',
    display:
    |
    'code' |
    'symbol' |
    'symbol-narrow' |
    string |
    boolean = 'symbol',
    digitsInfo: string = '3.2-2',
    locale: string = 'fr',
  ): string | null {
    return formatCurrency(
      value,
      locale,
      getCurrencySymbol(currencyCode, 'wide'),
      currencyCode,
      digitsInfo,
    );
  }
}


And after declaring MycurrencyPipe simply Import it in app.module.ts file and add it in declaration array of in your main module.ts file as shown below.

import {MycurrencyPipe} from './custom.currencypipe';

@NgModule({
 declarations: [
  MycurrencyPipe
]);


Now we can use newly created custom currency pipe named as mycurrencypipe as show below.

{{ Value | mycurrency }}


//100,23 €


List of Currency Codes for Angular Currency Pipe for all Countries around the world

Below is the list of country codes which you can use in angular currency pipe as per your country to display appropriate currency symbol

Andorran peseta Currency  

{{Value|currency:"ADP":"symbol"}}   ADP100


Afghan afghani Currency

{{Value|currency:"AFN":"symbol"}}   AFN100


Albanian lek Currency 

{{Value|currency:"ALL":"symbol"}}   ALL100


Armenian dram Currency 

{{Value|currency:"AMD":"symbol"}}   AMD100


Angolan kwanza Currency

{{Value|currency:"AOA":"symbol"}}   Kz100.00


Argentine peso Currency

{{Value|currency:"ARS":"symbol"}}   $100.00


Australian dollar Currency 

{{Value|currency:"AUD":"symbol"}}   $100.00


Bosnia and Herzegovina convertible mark Currency  

{{Value|currency:"BAM":"symbol"}}   KM100.00


Barbados dollar Currency  

{{Value|currency:"BBD":"symbol"}}   $100.00


Bangladeshi taka Currency 

{{Value|currency:"BDT":"symbol"}}   ৳100.00


Bahraini dinar Currency

{{Value|currency:"BHD":"symbol"}}   BHD100.000


Burundian franc Currency  

{{Value|currency:"BIF":"symbol"}}   BIF100


Bermudian dollar Currency 

{{Value|currency:"BMD":"symbol"}}   $100.00


Brunei dollar Currency 

{{Value|currency:"BND":"symbol"}}   $100.00


Boliviano Currency 

{{Value|currency:"BOB":"symbol"}}   Bs100.00


Brazilian real Currency

{{Value|currency:"BRL":"symbol"}}   R$100.00


Bahamian dollar Currency  

{{Value|currency:"BSD":"symbol"}}   $100.00


Botswana pula Currency 

{{Value|currency:"BWP":"symbol"}}   P100.00


Belarusian ruble Currency 

{{Value|currency:"BYN":"symbol"}}   р.100.00


Belarusian ruble Currency 

{{Value|currency:"BYR":"symbol"}}   BYR100


Belize dollar Currency 

{{Value|currency:"BZD":"symbol"}}   $100.00


Canadian dollar Currency  

{{Value|currency:"CAD":"symbol"}}   $100.00


Swiss franc Currency  

{{Value|currency:"CHF":"symbol"}}   CHF100.00


Unidad de Fomento Currency 

{{Value|currency:"CLF":"symbol"}}   CLF100.0000


Chilean peso Currency 

{{Value|currency:"CLP":"symbol"}}   $100


RenminbiRenminbi (Chinese) yuan Currency  

{{Value|currency:"CNY":"symbol"}}   ¥100.00


Colombian peso Currency

{{Value|currency:"COP":"symbol"}}   $100


Costa Rican colon Currency 

{{Value|currency:"CRC":"symbol"}}   ₡100.00


Cuban convertible peso Currency

{{Value|currency:"CUC":"symbol"}}   $100.00


Cuban peso Currency

{{Value|currency:"CUP":"symbol"}}   $100.00


Czech koruna Currency 

{{Value|currency:"CZK":"symbol"}}   Kč100.00


Djiboutian franc Currency 

{{Value|currency:"DJF":"symbol"}}   DJF100


Danish krone Currency 

{{Value|currency:"DKK":"symbol"}}   kr100.00


Dominican peso Currency

{{Value|currency:"DOP":"symbol"}}   $100.00


Egyptian pound Currency

{{Value|currency:"EGP":"symbol"}}   E£100.00


Spanish peseta Currency

{{Value|currency:"ESP":"symbol"}}   ₧100


Euro Currency 

{{Value|currency:"EUR":"symbol"}}   €100.00


Fijian dollarFiji dollar Currency 

{{Value|currency:"FJD":"symbol"}}   $100.00


Falkland Islands pound Currency 
{{Value|currency:"FKP":"symbol"}}   £100.00


Pound sterling Currency

{{Value|currency:"GBP":"symbol"}}   £100.00


Georgian lari Currency 

{{Value|currency:"GEL":"symbol"}}   ₾100.00


Gibraltar pound Currency  

{{Value|currency:"GIP":"symbol"}}   £100.00


Guinean franc Currency 

{{Value|currency:"GNF":"symbol"}}   FG100


Guatemalan quetzal Currency

{{Value|currency:"GTQ":"symbol"}}   Q100.00


Guyanese dollar Currency  

{{Value|currency:"GYD":"symbol"}}   $100


Hong Kong dollar Currency 

{{Value|currency:"HKD":"symbol"}}   $100.00


Honduran lempira Currency 

{{Value|currency:"HNL":"symbol"}}   L100.00


Croatian kuna Currency 

{{Value|currency:"HRK":"symbol"}}   kn100.00


Hungarian forint Currency 

{{Value|currency:"HUF":"symbol"}}   Ft100.00


Indonesian rupiah Currency 

{{Value|currency:"IDR":"symbol"}}   Rp100


Israeli new shekel Currency

{{Value|currency:"ILS":"symbol"}}   ₪100.00


Indian rupee Currency 

{{Value|currency:"INR":"symbol"}}   ₹100.00


Iraqi dinar Currency  

{{Value|currency:"IQD":"symbol"}}   IQD100


Iranian rial Currency 

{{Value|currency:"IRR":"symbol"}}   IRR100


Icelandic krona Currency  

{{Value|currency:"ISK":"symbol"}}   kr100


Italian lira Currency 

{{Value|currency:"ITL":"symbol"}}   ITL100


Jamaican dollar Currency  

{{Value|currency:"JMD":"symbol"}}   $100.00


Jordanian dinar Currency  

{{Value|currency:"JOD":"symbol"}}   JOD100.000


Japanese yen Currency 

{{Value|currency:"JPY":"symbol"}}   ¥100


Cambodian riel Currency

{{Value|currency:"KHR":"symbol"}}   ៛100.00


Comoro franc Currency 

{{Value|currency:"KMF":"symbol"}}   CF100


North Korean won Currency 

{{Value|currency:"KPW":"symbol"}}   ₩100


South Korean won Currency 

{{Value|currency:"KRW":"symbol"}}   ₩100


Kuwaiti dinar Currency 

{{Value|currency:"KWD":"symbol"}}   KWD100.000


Cayman Islands dollar Currency 

{{Value|currency:"KYD":"symbol"}}   $100.00


Kazakhstani tenge Currency 

{{Value|currency:"KZT":"symbol"}}   ₸100.00


Lao kip Currency  

{{Value|currency:"LAK":"symbol"}}   ₭100


Lebanese pound Currency

{{Value|currency:"LBP":"symbol"}}   L£100


Sri Lankan rupee Currency 

{{Value|currency:"LKR":"symbol"}}   Rs100.00


Liberian dollar Currency  

{{Value|currency:"LRD":"symbol"}}   $100.00


Lithuanian litas Currency 

{{Value|currency:"LTL":"symbol"}}   Lt100.00


Luxembourg franc Currency 

{{Value|currency:"LUF":"symbol"}}   LUF100


Latvian lats Currency 

{{Value|currency:"LVL":"symbol"}}   Ls100.00


Libyan dinar Currency 

{{Value|currency:"LYD":"symbol"}}   LYD100.000


Malagasy ariary Currency  

{{Value|currency:"MGA":"symbol"}}   Ar100


Malagasy franc Currency

{{Value|currency:"MGF":"symbol"}}   MGF100


Myanmar kyat Currency 

{{Value|currency:"MMK":"symbol"}}   K100


Mongolian tugrik Currency 

{{Value|currency:"MNT":"symbol"}}   ₮100


Mauritanian Ouguiya Currency  

{{Value|currency:"MRO":"symbol"}}   MRO100


Mauritian rupee Currency  

{{Value|currency:"MUR":"symbol"}}   Rs100


Mexican peso Currency 

{{Value|currency:"MXN":"symbol"}}   $100.00


Malaysian ringgit Currency 

{{Value|currency:"MYR":"symbol"}}   RM100.00


Namibian dollar Currency  

{{Value|currency:"NAD":"symbol"}}   $100.00


Nigerian naira Currency

{{Value|currency:"NGN":"symbol"}}   ₦100.00


Nicaraguan cordoba Currency

{{Value|currency:"NIO":"symbol"}}   C$100.00


Norwegian krone Currency  

{{Value|currency:"NOK":"symbol"}}   kr100.00


Nepalese rupee Currency

{{Value|currency:"NPR":"symbol"}}   Rs100.00


New Zealand dollar Currency

{{Value|currency:"NZD":"symbol"}}   $100.00


Omani rial Currency

{{Value|currency:"OMR":"symbol"}}   OMR100.000


Philippine peso Currency  

{{Value|currency:"PHP":"symbol"}}   ₱100.00


Pakistani rupee Currency  

{{Value|currency:"PKR":"symbol"}}   Rs100


Polish zloty Currency 

{{Value|currency:"PLN":"symbol"}}   zł100.00


Paraguayan guarani Currency

{{Value|currency:"PYG":"symbol"}}   ₲100


Romanian leu Currency 

{{Value|currency:"RON":"symbol"}}   lei100.00


Serbian dinar Currency 

{{Value|currency:"RSD":"symbol"}}   RSD100


Russian ruble Currency 

{{Value|currency:"RUB":"symbol"}}   ₽100.00


Russian ruble Currency 

{{Value|currency:"RUR":"symbol"}}   р.100.00


Rwandan franc Currency 

{{Value|currency:"RWF":"symbol"}}   RF100


Solomon Islands dollar Currency

{{Value|currency:"SBD":"symbol"}}   $100.00


Swedish krona/kronor Currency 

{{Value|currency:"SEK":"symbol"}}   kr100.00


Singapore dollar Currency 

{{Value|currency:"SGD":"symbol"}}   $100.00


Saint Helena pound Currency

{{Value|currency:"SHP":"symbol"}} £100.00


Sierra Leonean leone Currency 

{{Value|currency:"SLL":"symbol"}} SLL100


Somali shilling Currency  

{{Value|currency:"SOS":"symbol"}} SOS100


Surinamese dollar Currency 

{{Value|currency:"SRD":"symbol"}} $100.00


South Sudanese pound Currency 

{{Value|currency:"SSP":"symbol"}} £100.00


Sao Tome/Principe Dobra Currency  

{{Value|currency:"STD":"symbol"}} STD100


Sao Tome/Principe Dobra Currency  

{{Value|currency:"STN":"symbol"}} Db100.00


Syrian pound Currency 

{{Value|currency:"SYP":"symbol"}} £100


Thai baht Currency 

{{Value|currency:"THB":"symbol"}} ฿100.00


Turkmenistani manat Currency  

{{Value|currency:"TMM":"symbol"}} TMM100


Tunisian dinar Currency

{{Value|currency:"TND":"symbol"}} TND100.000


Tongan paanga Currency 

{{Value|currency:"TOP":"symbol"}} T$100.00


Turkish lira Currency 

{{Value|currency:"TRL":"symbol"}} TRL100


Turkish lira Currency 

{{Value|currency:"TRY":"symbol"}} ₺100.00


Trinidad and Tobago dollar Currency

{{Value|currency:"TTD":"symbol"}} $100.00


New Taiwan dollar Currency 

{{Value|currency:"TWD":"symbol"}} $100.00


Tanzanian shilling Currency

{{Value|currency:"TZS":"symbol"}} TZS100


Ukrainian hryvnia Currency 

{{Value|currency:"UAH":"symbol"}} ₴100.00


Ugandan shilling Currency 

{{Value|currency:"UGX":"symbol"}} UGX100


United States dollar Currency 

{{Value|currency:"USD":"symbol"}} $100.00


Uruguay Peso en Unidades Indexadas Currency

{{Value|currency:"UYI":"symbol"}} UYI100


Uruguayan peso Currency

{{Value|currency:"UYU":"symbol"}} $100.00


Uzbekistan som Currency

{{Value|currency:"UZS":"symbol"}} UZS100


Venezuelan bolivar Currency

{{Value|currency:"VEF":"symbol"}} Bs100.00


Vietnamese dong Currency  

{{Value|currency:"VND":"symbol"}} ₫100


Vanuatu vatu Currency 

{{Value|currency:"VUV":"symbol"}} VUV100


CFA franc BEAC Currency

{{Value|currency:"XAF":"symbol"}} FCFA100


East Caribbean dollar Currency 

{{Value|currency:"XCD":"symbol"}} $100.00


CFA franc BCEAO Currency  

{{Value|currency:"XOF":"symbol"}} CFA100


CFP franc (franc Pacifique) Currency  

{{Value|currency:"XPF":"symbol"}} CFPF100


Yemeni rial Currency  

{{Value|currency:"YER":"symbol"}} YER100


South African rand Currency

{{Value|currency:"ZAR":"symbol"}} R100.00


Zambian kwacha Currency

{{Value|currency:"ZMK":"symbol"}} ZMK100


Zambian kwacha Currency

{{Value|currency:"ZMW":"symbol"}} ZK100.00


Zimbabwean dollar Currency 

{{Value|currency:"ZWD":"symbol"}} ZWD100



Below are some code snippets related to Currency Pipe Angular

Indian currency pipe in Angular 6

Currency pipe in Angular

Hope you have now understood the use of angular currency pipe

Happy Coding!