Удаление децимал/центов валюты AngularJS
Есть ли способ удалить десятичные/цанты из вывода фильтра валюты? Я делаю что-то вроде этого:
<div>{{Price | currency}}</div>
Какие выходы:
$1,000.00
Вместо этого мне бы хотелось:
$1000
Можно ли это сделать, используя фильтр валют? Я знаю, что могу добавить знак доллара на число, и я мог бы написать свой собственный фильтр, но я надеялся, что существует простой метод с существующим фильтром валюты.
Спасибо.
Ответы
Ответ 1
Обновить: с версии 1.3.0 - currencyFilter: добавить fractionSize как необязательный параметр, см. commit
и обновленный plunker
{{10 | currency:undefined:0}}
Обратите внимание, что это второй параметр, поэтому вам нужно передать undefined для использования текущего символа валюты локали
Обновить. Обратите внимание, что это работает только для символов валюты, которые отображаются перед номером.
Начиная с версии 1.2.9 она по-прежнему жестко привязана к двум десятичным знакам.
Здесь - модифицированная версия, которая использует копию angular formatNumber, чтобы включить 0 fractionSize для валюты.
Обычно это нужно настраивать либо в определении локали, либо в вызове currencyFilter, но прямо сейчас (1.0.4), он жестко закодирован до двух знаков после запятой.
Пользовательский фильтр:
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) + ')';
};
} ]);
Шаблон:
<div>{{Price | noFractionCurrency}}</div>
Пример:
Обновление: исправлена ошибка при обработке отрицательных значений
Ответ 2
Вопрос кажется довольно старым, и эти ответы хороши. Однако есть еще одно альтернативное решение, которое также может помочь (что я использую в своих проектах).
Это очень хорошо работает с префиксом символов валюты, а также с суффиксом числа для положительных и отрицательных значений.
Пользовательский фильтр:
angular.module('your-module', [])
.filter('nfcurrency', [ '$filter', '$locale', function ($filter, $locale) {
var currency = $filter('currency'), formats = $locale.NUMBER_FORMATS;
return function (amount, symbol) {
var value = currency(amount, symbol);
return value.replace(new RegExp('\\' + formats.DECIMAL_SEP + '\\d{2}'), '')
}
}])
Шаблон:
<div>{{yourPrice| nfcurrency}}</div>
Примеры для разных локалей:
- 10.00 (en-gb) → £ 10
- 20.00 (ru-ru) → $20
- -10.00 (ru-ru) → ($ 10)
- 30.00 (da-dk) → 30 kr
- -30.00 (da-dk) → -30 kr
Пожалуйста, посмотрите демо-версию для долларов США и Датская крона.
Обновление
Обратите внимание, что это обходное решение подходит для AngularJS 1.2 и более ранних версий библиотеки. Начиная с AngularJS 1.3, вы можете использовать форматер currency с третьим параметром, определяющим размер фракции - "Число десятичных знаков для округления суммы до",
Обратите внимание, что для использования формата валюты по умолчанию, исходящего из локализации AngularJS, вам нужно будет использовать символ валюты (второй параметр), установленный в undefined
(null
или пустой НЕ будет работать). Пример в демонстрациях для долларов США и Датская крона.
Ответ 3
Еще одна вещь, о которой стоит подумать, заключается в том, что если вы знаете, что у вас есть только один язык или один тип валюты, вы можете поместить символ валюты перед номером, а затем использовать такой фильтр чисел (для американской валюты).
${{Price | number:0}}
Более быстрое решение, если вы не хотите бросать новый фильтр и иметь только одну валюту.
Ответ 4
Поздно, но может быть, это может помочь кому-то
{{value | currency : 'Your Symbol' : decimal points}}
Итак, посмотрим несколько примеров с выходом
{{10000 | currency : "" : 0}} // 10,000
{{10000 | currency : '$' : 0}} // $10,000
{{10000 | currency : '$' : 2}} // $10,000.00
{{10000 | currency : 'Rs.' : 2}} // Rs.10,000.00
{{10000 | currency : 'USD $' : 2}} // USD $10,000.00
{{10000 | currency : '#' : 3}} // #10,000.000
{{10000 | currency : 'ANYTHING: ' : 5}} // ANYTHING: 10,000.00000
Смотрите демонстрацию
Ответ 5
Это другое подобное решение, но оно удаляет .00 десятичных знаков, но оставляет любую другую десятичную сумму.
$10.00 до $10
$10,20 до $10,20
app.filter('noFractionCurrency', [ '$filter', '$locale', function(filter, locale) {
var currencyFilter = filter('currency');
var formats = locale.NUMBER_FORMATS;
return function(amount, currencySymbol) {
amount = amount ? (amount*1).toFixed(2) : 0.00;
var value = currencyFilter(amount, currencySymbol);
// split into parts
var parts = value.split(formats.DECIMAL_SEP);
var dollar = parts[0];
var cents = parts[1] || '00';
cents = cents.substring(0,2)=='00' ? cents.substring(2) : '.'+cents; // remove "00" cent amount
return dollar + cents;
};
}]);
Ответ 6
Другое решение, это удаляет конечные нули и находит правильный символ валюты для наиболее распространенных валют:
{{10.00 | money: USD}} до $10
{{10.00 | money: EUR}} до € 10
/**
* @ngdoc filter
* @name money
* @kind function
*
* @description
* Formats a number as a currency (ie $1,234.56), removing trailing zeros and using the real currency symbol when possible. When no currency symbol is provided, default
* symbol for current locale is used.
*
* @param {number} amount Input to filter.
* @param {string=} symbol Currency symbol or identifier to be displayed.
* @returns {string} Formatted number. *
*/
app.filter('money', [ '$filter', '$locale', function (filter, locale) {
var currencyFilter = filter('currency');
var formats = locale.NUMBER_FORMATS;
var getCurrencySymbol = function (code) {
switch (code.toUpperCase()) {
case 'EUR': //Euro
return '€';
case 'USD': //Dólar americano
case 'MXN': //Peso mejicano
case 'CAD': //Dólar de Canadá
case 'AUD': //Dólar australiano
case 'NZD': //Dólar neozelandés
case 'HKD': //Dólar de Hong Kong
case 'SGD': //Dólar de Singapur
case 'ARS': //Peso argentino
return '$';
case 'CNY': //Yuan chino
case 'JPY': //Yen japonés
return '¥';
case 'GBP': //Libra esterlina
case 'GIP': //Libras de Gibraltar
return '£';
case 'BRL': //Real brasileño
return 'R$';
case 'INR': //Rupia india
return 'Rp';
case 'CHF': //Franco suizo
return 'Fr';
case 'SEK': //Corona sueca
case 'NOK': //Corona noruega
return 'kr';
case 'KPW': //Won de Corea del Norte
case 'KRW': //Won de Corea del Sur
return '₩';
default:
return code;
}
};
return function (amount, currency) {
var value;
if (currency) {
value = currencyFilter(amount, getCurrencySymbol(currency));
}
else {
value = currencyFilter(amount);
}
//Remove trailing zeros
var regex = new RegExp("\\" + formats.DECIMAL_SEP + "0+", "i");
return value.replace(regex, '');
};
} ]);
Ответ 7
Решение для версии angular 1,3,
если вы используете i18n, самый простой способ:
$filter('number')(x,0) + ' ' +$locale.NUMBER_FORMATS.CURRENCY_SYM;
Таким образом, у вас есть номер, отформатированный с правильными разделителями и символом валюты на основе языкового стандарта.
Ответ 8
Для AngularJS 1.2
Вы можете просто комбинировать фильтры number
и currency
app.filter('noFractionCurrency', ['numberFilter', 'currencyFilter', function(numberFilter, currencyFilter) {
return function(input, symbol) {
var amount = numberFilter(input);
return symbol + amount;
};
}]);
Ответ 9
И вот если вы хотите округлить до ближайшего $1000: Live Demo:
var app = angular.module('angularjs-starter', []);
app.filter('noFractionRoundUpCurrency',
[ '$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) {
if (amount % 1000 < 500){
return '$' + (amount - (amount % 500));
} else {
return '$' + (amount - (amount % 500) + 500);
}
}
else{
if (-amount % 1000 < 500){
return '($' + (-amount - (-amount % 500)) + ')';
} else {
return '($' + (-amount - (-amount % 500) + 500)+ ')';
}
}
};
} ]);
app.controller('MainCtrl', function($scope) {
});
Ответ 10
Именно то, что мне нужно!
Я добавил условие, чтобы просто заменить фильтр валют Angular вообще и просто использовать модифицированную версию фильтра, увиденную выше, @Tom. Я уверен, что есть лучшие способы сделать это, но, похоже, для меня это хорошо работает.
'use strict';
angular.module('your-module')
.filter('nfcurrency', [ '$filter', '$locale', function ($filter, $locale) {
var currency = $filter('currency'), formats = $locale.NUMBER_FORMATS;
return function (amount, symbol) {
var value = currency(amount, symbol), valArr = value.split(formats.DECIMAL_SEP);
if(parseInt(valArr[(valArr.length - 1)]) > 0) {
return value;
} else {
return value.replace(new RegExp('\' + formats.DECIMAL_SEP + '\d{2}'), '');
}
};
}]);
Ответ 11
Я немного изменил фильтр, отправленный @Liviu T., чтобы принимать валюты с символом после числа и определенного числа десятичных знаков:
app.filter('noFractionCurrency',
[ '$filter', '$locale', function(filter, locale) {
var currencyFilter = filter('currency');
var formats = locale.NUMBER_FORMATS;
return function(amount, num, currencySymbol) {
if (num===0) num = -1;
var value = currencyFilter(amount, currencySymbol);
var sep = value.indexOf(formats.DECIMAL_SEP)+1;
var symbol = '';
if (sep<value.indexOf(formats.CURRENCY_SYM)) symbol = ' '+formats.CURRENCY_SYM;
return value.substring(0, sep+num)+symbol;
};
} ]);
Например:
{{10.234 | noFractionCurrency:0}}
{{10.55555 | noFractionCurrency:2}}
Выходы:
$10
$10.56
Демо
Ответ 12
Если вы используете angular -i18n (bower install angular-i18n
), вы можете использовать декоратор для изменения значений по умолчанию в локали файлов, например:
$provide.decorator('$locale', ['$delegate',
function ($delegate) {
$delegate.NUMBER_FORMATS.PATTERNS[1].maxFrac = 0;
$delegate.NUMBER_FORMATS.PATTERNS[1].minFrac = 0;
return $delegate;
}]);
Обратите внимание, что это применимо ко всем применениям фильтра валют в вашем коде.