CODEWITHSUNDEEP
javascriptangularjs
Diego
Diego

Reputation: 242

Number Format in AngularJS

I have this number.

20.79

I need see the number as

20,79

Or

1.200,76 €

How can I change the . by , and add € currency?

Thanks!

Solution

app.filter('customCurrency', function(){
    return function(input, symbol, place){
        if(isNaN(input)){
            return input;
        } else {
            var symbol = symbol || '$';
            var place = place === undefined ? true : place;
            if(place === true){
                return symbol + input;
            } else{
                var new_input = input.replace(".", ",");
                return new_input + symbol;
            }
        }
    }
})

Upvotes: 2

Views: 15221

Answers (2)

hd84335
hd84335

Reputation: 9873

You can do it by simply changing your Locale to match the European currency:

Import this library

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-i18n/1.6.0/angular-locale_de-de.js"></script>

In your html

<div>{{ myNumber | currency: '€' }}</div>

In your controller

$scope.myNumber = 1220.79;

Result: 1.220,79 €

Please check it: JSFiddle Demo

Upvotes: 3

Mistalis
Mistalis

Reputation: 18269

Use the currency filter:

In your Angular controller:

$scope.myNumber = 20.79;

In your HTML page:

<div>{{myNumber | currency}}</div>

Update: If you need to display in €, 2 options:

  • Set your locale to your country: <script src="i18n/angular-locale_de-de.js"></script> (best option).
  • Display it without currency filter: {{(myNumber | number: 2) + " €"}}.

Demo on JSFiddle.

Upvotes: 2

Related Questions