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

Hello Devs, 

In this tutorial, we will learn Angular Currency Pipe Example | Currency Pipe in Angular 9/8/7

In this section, you will see the example and how to use angular currency pipe in component file.

Follow this step by step guide below. 

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;

}

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;

}

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;

}

May this example help you.