Removing AngularJS currency filter decimal/cents

Question

Is there a way to remove the decimal/cents from the output of a currency filter? I'm doing something like this:

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

Which outputs:

$1,000.00

Instead, I'd like:

$1,000

Can that be done using the currency filter? I know I can prepend a dollar sign onto a number, and I could write my own filter, but I was hoping a simple method exists with the existing currency filter.

Thank you.

Answer 1

Update: as of version 1.3.0 - currencyFilter: add fractionSize as optional parameter, see commit and updated plunker

{{10 | currency:undefined:0}}

Note that it's the second parameter so you need to pass in undefined to use the current locale currency symbol

Update: Take note that this only works for currency symbols that are displayed before the number. As of version 1.2.9 it's still hardcoded to 2 decimal places.

Here is a modified version that uses a copy of angular's formatNumber to enable 0 fractionSize for currency.

---

Normally this should be configurable either in the locale definition or the currencyFilter call but right now(1.0.4) it's hardcoded to 2 decimal places.

Custom filter:

myModule.filter('noFractionCurrency',
  [ '$filter', '$locale',
  function(filter, locale) {
    var currencyFilter = filter('currency');
    var formats = locale.NUMBER_FORMATS;
    return function(amount, currencySymbol) {
      var value = currencyFilter(amount, currencySymbol);
      var sep = value.indexOf(formats.DECIMAL_SEP);
      if(amount >= 0) { 
        return value.substring(0, sep);
      }
      return value.substring(0, sep) + ')';
    };
  } ]);

Template:

<div>{{Price | noFractionCurrency}}</div>

Example:

• Demo

Update: fixed a bug when handling negative values