Angular2 Currency Pipe change decimal separator

Question

Hello angular friends,

I\'m working on an angular2 app (multiple actually). And I live in the Netherlands.

Currently I\'m formatting my currency with the followi

Answer 1

you need import that

import { registerLocaleData } from '@angular/common';
import localeIt from '@angular/common/locales/it'
registerLocaleData(localeIt, 'it');

and add that pipe in view

{{ 1000 | currency: 'EUR':'symbol':'.2-2':'it' }}

Answer 2

Your problem has probably been solved some time ago, but just for reference for other Dutch developers (like myself):

Create a custom Pipe:

import {Pipe} from '@angular/core';
 
@Pipe({
    name: 'currencyFormat'
})
export class CurrencyFormat {
    transform(value: number,
        currencySign: string = '€ ',
        decimalLength: number = 2, 
        chunkDelimiter: string = '.', 
        decimalDelimiter:string = ',',
        chunkLength: number = 3): string {

        value /= 100;

        let result = '\\d(?=(\\d{' + chunkLength + '})+' + (decimalLength > 0 ? '\\D' : '$') + ')';
        let num = value.toFixed(Math.max(0, ~~decimalLength));

        return currencySign+(decimalDelimiter ? num.replace('.', decimalDelimiter) : num).replace(new RegExp(result, 'g'), '$&' + chunkDelimiter);
    }
}

Now you can use:

{{someIntegerWithCentsToBeDivided | currencyFormat}}

The Pipe has already all the Dutch defaults included, but you can easily change them or use them as arguments in the template. For example:

{{1234567 | currencyFormat:'$':2:' ':'.':3}}

will give $12 345.67 as output.

Answer 3

I'm too late but I found a solution.

I'm just create a pipe to replace anything:

import { PipeTransform, Injectable, Pipe }     from '@angular/core';
@Pipe({
  name: 'replace'
})
@Injectable()
export class ReplacePipe implements PipeTransform {
  constructor(){}
  transform(item: any, replace, replacement): any {
    if(item == null) return "";
    item = item.replace(replace, replacement);
    return item;
  }
}

I used that twice to solve your case.

{{ 5.01999 | currency:'BRL':true | replace:'.':',' | replace:',00':',-' }}}

Answer 4

I find all of these solutions too big with too many lines of code to achieve something so small. The good thing about them is if you're using them a lot through your app. For smaller cases, I personally would use this approach:

<div>{{(checkout.delivery_fee | currency).replace('.',',')}}</div>

So I can display something like: Delivery fee: $5,50

But, if you need to display a value greather than 1.000, you could use:

<div>{{(checkout.delivery_fee | currency).replace(',','x').replace('.',',').replace('x','.')}}</div>