How to display the currency symbol to the right in Angular

Question

I have to display Euro currency like this : 583 €.

But with this code:

{{ price | currency:'EUR':true }} 

I get €583, is there any option in Angular core to move the symbol to right? A lot of european countries use the symbol at the right (France, Germany, Spain, Italy).

Answer 1

Since Angular2 RC6 version you can set default locale directly in your app module (providers):

import {NgModule, LOCALE_ID} from '@angular/core';  @NgModule({   providers: [{       provide: LOCALE_ID,       useValue: 'de-DE' // 'de-DE' for Germany, 'fr-FR' for France ...     },   ] }) 

Afterwards the currency pipe should pick up the locale settings and move the symbol to right:

@Component({   selector:"my-app",    template:`     <h2>Price:<h2>      {{price|currency:'EUR':true}}   ` }) 

Answer 2

This is working (angular 6) on html side:

{{ amount | currency: 'EUR':'symbol':undefined:'fr-FR' }} 

and on typescript side:

const number = 123456.789; console.log(new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR' }).format(number)); 

123.456,79 €