Misha Moroshko Misha Moroshko - 6 months ago 302
AngularJS Question

Why AngularJS currency filter formats negative numbers with parenthesis?

Live Demo

Why this:

# Controller
$scope.price = -10;

# View
{{ price | currency }}


results in
($10.00)
rather than
-$10.00
?

Answer

This is a popular way to represent negative currencies. Wikipedia:

In bookkeeping, amounts owed are often represented by red numbers, or a number in parentheses, as an alternative notation to represent negative numbers.

You can see in the Angular source code where they do this (negSuf/negPre):

function $LocaleProvider(){
  this.$get = function() {
    return {
      id: 'en-us',

      NUMBER_FORMATS: {
        DECIMAL_SEP: '.',
        GROUP_SEP: ',',
        PATTERNS: [
          { // Decimal Pattern
            minInt: 1,
            minFrac: 0,
            maxFrac: 3,
            posPre: '',
            posSuf: '',
            negPre: '-',
            negSuf: '',
            gSize: 3,
            lgSize: 3
          },{ //Currency Pattern
            minInt: 1,
            minFrac: 2,
            maxFrac: 2,
            posPre: '\u00A4',
            posSuf: '',
            negPre: '(\u00A4',
            negSuf: ')',
            gSize: 3,
            lgSize: 3
          }
        ],
        CURRENCY_SYM: '$'
      },
Comments