Angular Currency Pipe Example | Currency Pipe in Angular 9/8/7

Hello,

This article goes in detailed on angular 9/8/7 currency pipe example. Here you will learn angular 9 currency pipe example. it's simple example of indian currency pipe in angular 8. you will learn angular currency pipe example. So, let's follow few step to create example of currency pipe angular example.

In this tutorial i will provide you full example and how to use angular currency pipe in component file. you can use it in angular 6, angular 7, angular 8 and angular 9 application.

I am not going to explain more and more description but i will simply give you syntax and some small examples so you can easily use it in your application.

Syntax:

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

Default Example

import { Component } from '@angular/core';
  
@Component({
  selector: 'my-app',
  template: `
        <div>
            <p>{{ myCurrency | currency }}</p>
        </div>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  myCurrency = 100;
}

Output:

$100.00

Currency with Type Example

import { Component } from '@angular/core';
  
@Component({
  selector: 'my-app',
  template: `
        <div>
            <p>{{ myCurrency | currency: 'CAD' }}</p>
            <p>{{ myCurrency2 | currency: 'INR' }}</p>
        </div>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  myCurrency = 100;
  myCurrency2 = 200;
}

Output:

CA$100.00
  
₹200.00

Currency with Type and Symbol Example

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: `
        <div>
            <p>{{ myCurrency | currency: 'USD': 'symbol':'4.2-2' }}</p>
        </div>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  myCurrency = 100.330;
}

Output:

$0,100.33

I hope it can help you...