Угловая валюта Js, символ евро после
Как переместить символ евро с передней части значения на после нее?
Пример:
{{product.price | currency : "€"}} будет производить € 12.00
но я бы хотел 12.00 €
9 ответов
Вам не нужно взламывать фильтр валют!
AngularJS имеет отличную поддержку i18n/l10n. Фильтр валюты использует символ валюты по умолчанию из службы локали и позиционирует его в соответствии с настройками локали.
Так что это все о поддержке и настройке правильного языка.
<script src="i18n/angular-locale_de-de.js"></script>
Если вы используете npm или же bower все локали доступны через angular-i18n пакет
<span>{{ product.price | currency }}</span>
теперь выдаст следующий вывод:
65,95 €
Поддержка нескольких локализаций
Если вы хотите поддерживать несколько локализаций, будьте осторожны с символом валюты, поскольку он меняется на валюту по умолчанию используемой локали. Но 65,95 € отличаются от $65,95, В качестве параметра укажите символ валюты:
<span>{{ product.price | currency:'€' }}</span>
В de-de выход по-прежнему будет 65,95 € но если местоположение, например. en-us это было бы €65.95 (что, несмотря на некоторые другие высказывания, правильный формат для отображения цен в евро на английском языке).
Чтобы узнать больше об угловых и i18n / l10n, обратитесь к руководству разработчика.
Вы не можете с валютным фильтром. Вы можете написать свой собственный, или просто использовать числовой фильтр.
{{(produce.price | number:2) + "€"}}
Предлагаемые решения все грязные.
Сначала фильтр позволяет изменить символ, добавив его в качестве параметра:
{{product.price | currency : "€"}}
но правильный путь - это локализовать ваше приложение, как предлагает @Andreas, если вы локализуете свое приложение, например, с настройкой итальянской локали (it-it) внутри своего приложения, вам нужно только вызвать фильтр, чтобы получить знак €.
{{product.price | currency }}
В настройках итальянского языка ставится знак евро перед значением валюты. Вы можете изменить значение локали che или намного лучше переопределить их, как предложено в следующем связанном ответе:
Почему фильтр валют AngularJS форматирует отрицательные числа с круглыми скобками?
Вы можете переопределить настройку локали, указав символ валюты (\u00A4) в качестве префикса или суффикса для положительного значения и отрицательного значения.
app.config(['$provide', function($provide) {
$provide.decorator('$locale', ['$delegate', function($delegate) {
if($delegate.id == 'it-it') {
$delegate.NUMBER_FORMATS.PATTERNS[1].negPre = '\u00A4\u00a0-';
$delegate.NUMBER_FORMATS.PATTERNS[1].negSuf = '';
$delegate.NUMBER_FORMATS.PATTERNS[1].posPre = '\u00A4\u00a0';
$delegate.NUMBER_FORMATS.PATTERNS[1].posSuf = '';
}
return $delegate;
}]);
}]);
поэтому после этой инструкции фильтр:
{{product.price | currency}}
будет производить следующий вывод
€ 12
Используйте этот трюк.
<div>{{product.price | currency : '' }} €</div>
Angularjs оказывает большую поддержку интернационализации и локализации. Применение интернационализации и локализации зависит от сферы применения. Например, если ваше приложение поддерживает только евро, вам нужна только локализация для евро и не требуется вся валюта и ее форматирование.
В такой ситуации (при условии, что ваша ситуация похожа на описанную выше) вы можете создать конфигурацию приложения и установить локаль в качестве необходимой вам локализации с помощью некоторых декораторов. Функция декоратора перехватывает создание сервиса, позволяя ему переопределить или изменить поведение сервиса.
angular
.module('app', [])
.config(['$provide', function($provide) {
$provide.decorator('$locale', ['$delegate', function($delegate) {
$delegate.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: 0,
maxFrac: 1,
posPre: '\u00A4',
posSuf: '',
negPre: '(\u00A4',
negSuf: ')',
gSize: 3,
lgSize: 3
}],
CURRENCY_SYM: '€'
}
return $delegate;
}]);
}])
.controller('appController', ['$scope', function($scope) {
$scope.price = 20.55;
}])<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<div ng-app="app">
<div ng-controller="appController">
Price : {{price | currency}}
</div>
</div>Приведенная выше конфигурация показывает все возможные значения для десятичной и валютной настроек. Вы можете изменить в соответствии с вашими требованиями на уровне приложения.
Если вы не хотите, чтобы эффект был во всем приложении, лучше обратиться к директиве
Это довольно старый вопрос, в наши дни все по-другому.. Может быть, тогда это было так же хорошо..
Так что, если кто-то еще найдет это..
Но вам нужно включить правильный языковой стандарт, чтобы получить правильное форматирование валюты в валютном фильтре.
Проверьте угловую документацию, например, форматирование голландской валюты составляет 5,00 евро, в то время как английский - 5,00 евро, американский - 5 евро
Я использую это решение в своем проекте (в производстве) во Франции (оно должно ВСЕГДА показывать 5,00€, НИКОГДА не показывать 5,00 €):
<span>Price: {{product.price| currency:""}} €</span>
Пожалуйста, прочитайте реальный вопрос этого поста (угловая валюта Js, символ евро после), прежде чем понизить скорость слишком быстро!!!!!
С использованием locale (как объяснено в ответе в этой теме - в валюте Angular Js, символ евро после) кажется наиболее правильным способом сделать это, но, похоже, он не предлагает гибкости, чтобы поместить символ или имя валюты туда, где вы хотите относительно значения, на которое вы ссылаетесь. Если вам нужно иметь символ валюты после вашей стоимости, вы можете иметь отдельный product.currency поле и интерполировать это после (или до) вашего значения цены.
Так что если у вас есть product.price = 40 а также product.currency = '€', вы можете отобразить это как 40 € с {{product.price}} {{product.currency}}, Или 40 евро, поменяв поля: {{product.currency}} {{product.price}},
Возможно, вы захотите отформатировать product.price значения через десятичную трубу, если вы это сделали ( https://angular.io/api/common/DecimalPipe). - Таким образом, "40,00 €" будет: {{product.amount | number:'2.2-2'}} {{product.currency}},
к вашему сведению - в этом случае, я бы, вероятно, имел отдельное поле product.currency а также product.currencySymbol (например, "USD" и "$" соответственно), но затем вы получаете больше в функциональности locale как указано в другом ответе я ссылку выше. Но если вам нужно поместить имя или символ валюты в другом месте относительно значения, отличного от того, что Angular позволит вам делать через его собственные каналы, и вы хотите использовать валюту, относящуюся к записи или набору, с которыми вы работаете без жесткого кодирования его символа или имени на странице (например, если у вас есть несколько отображаемых валют), это один из способов сделать это динамически.
Вы можете создать фильтр:
app.filter('euroFormat', function () {
return function (input) {
return input+' \u20AC';
};
});
и примените его к своему HTML-коду с помощью:
<span>Price: {{product.price| euroFormat}}</span>