Почему фильтр валют AngularJS форматирует отрицательные числа с круглыми скобками?

Question

Live Demo

Почему это:

# Controller
$scope.price = -10;

# View
{{ price | currency }}

результаты в ($10.00) скорее, чем -$10.00?

Answer 1

Это популярный способ представления отрицательных валют. Википедия:

В бухгалтерском учете суммы задолженности часто обозначаются красными цифрами или цифрами в скобках в качестве альтернативного обозначения для представления отрицательных чисел.

Вы можете увидеть в исходном коде Angular, где они это делают (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: '$'
      },

Answer 2

Я знаю, что это старый вопрос, но принятый ответ только отвечает на вопрос, почему это происходит, без конкретного решения проблемы. Я думаю, что "самый правильный способ" сделать это - использовать декоратор так:

angular
    .module('app')
    .config(['$provide', function($provide) {
        $provide.decorator('$locale', ['$delegate', function($delegate) {
          if($delegate.id == 'en-us') {
            $delegate.NUMBER_FORMATS.PATTERNS[1].negPre = '-\u00A4';
            $delegate.NUMBER_FORMATS.PATTERNS[1].negSuf = '';
          }
          return $delegate;
        }]);
      }]);

Это вызывается только один раз, действительно для любого фильтра, который зависит от него, и вам не нужен специальный фильтр для форматирования вашей валюты.

Answer 3

Это работает лучше для меня, проверяя отрицательное число:

var app = angular.module('myApp');

app.filter('customCurrency', ["$filter", function ($filter) {       
    return function(amount, currencySymbol){
        var currency = $filter('currency');         

        if(amount < 0){
           return currency(amount, currencySymbol).replace("-", "(") + ')'
        }

        return currency(amount, currencySymbol);
    };
}]);

Answer 4

Вы имеете в виду дисплей - 10 долларов, а не (10 долларов)?

По умолчанию, по крайней мере, angularJs версии 1.2.1 отображается с круглыми скобками. Например: ($10,00).

Если так, то это моя ситуация. Я создал собственный фильтр для этого:

var app = angular.module('myApp');

app.filter('customCurrency', ["$filter", function ($filter) {       
  return function(amount, currencySymbol){
     var currency = $filter('currency');         

     if(amount.charAt(0) === "-"){
        return currency(amount, currencySymbol).replace("(", "-").replace(")", ""); 
     }

     return currency(amount, currencySymbol);
  };

}]);

Поэтому он делегирует встроенный фильтр валют и "декорирует" или "декорирует" скобки.

Я не смог найти способ изменить $LocaleProvider на лету. Если кто-то знает, пожалуйста, дайте мне знать.

ура Леонардо Корреа

Answer 5

Обновление: Angular 1.4 больше не использует скобки для обозначения отрицательных значений, но теперь использует символ "-". Вот ссылка на обсуждение: https://github.com/angular/angular.js/issues/12870

Я использовал декоратор, как описано в marc, чтобы вернуть.negPre и.negSuf для использования паренов.

Answer 6

Если вы не против сохранить скобки и просто хотите быстро и легко добиться этого
например: -($250.00) попробуйте следующее:

<ul ng-repeat="data in customers">
  <li>
    Balance: 
    <span ng-if="data.balance<0">-</span>
    <span ng-if="data.balance>0">+</span>
    {{data.balance | currency}}
  </li>
</ul>  

Если вы хотите удалить ()Затем вы можете создать свой собственный фильтр или попробовать другие ответы.

Answer 7

Отредактируйте файл angular.js в строке с номером -36180, измените negPre и negSuf, удалив и поставив скобки

Например

Меняться от:

"NUMBER_FORMATS": {
"CURRENCY_SYM": "$",
"DECIMAL_SEP": ".",
"GROUP_SEP": ",",
"PATTERNS": [
  {
    "gSize": 3,
    "lgSize": 3,
    "maxFrac": 3,
    "minFrac": 0,
    "minInt": 1,
    "negPre": "-",
    "negSuf": "",
    "posPre": "",
    "posSuf": ""
  },
  {
    "gSize": 3,
    "lgSize": 3,
    "maxFrac": 2,
    "minFrac": 2,
    "minInt": 1,
    "negPre": "-\u00a4",
    "negSuf": "",
    "posPre": "\u00a4",
    "posSuf": ""
  }
]

}

к

"NUMBER_FORMATS": {
"CURRENCY_SYM": "$",
"DECIMAL_SEP": ".",
"GROUP_SEP": ",",
"PATTERNS": [
  {
    "gSize": 3,
    "lgSize": 3,
    "maxFrac": 3,
    "minFrac": 0,
    "minInt": 1,
    "negPre": "-",
    "negSuf": "",
    "posPre": "",
    "posSuf": ""
  },
  {
    "gSize": 3,
    "lgSize": 3,
    "maxFrac": 2,
    "minFrac": 2,
    "minInt": 1,
    "negPre": "(\u00a4",
    "negSuf": ")",
    "posPre": "\u00a4",
    "posSuf": ""
  }
]

}