Валюта AngularJs в евро [дубликат]

Вы не можете использовать фильтр валют. Вы можете написать свой собственный или просто использовать числовой фильтр.

{{(produce.price | number:2) + "€"}}

Предлагаемые решения загрязнены.

сначала фильтр позволяет изменить символ, добавив его как параметр:

{{product.price | currency : "€"}}

, но правильный путь - локализовать ваше приложение как предложенный @Andreas, если вы локализуете свое приложение, например, с помощью итальянской настройки локали (it-it) внутри вашего приложения, вам нужно только вызвать фильтр для получения знака €.

{{product.price | currency }}

Итальянский языковой настрой Евро перед валютой. Вы можете изменить значение своего языка или лучше переустановить их, как предложено в следующем связанном ответе:

Почему фильтр валюты 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 отличная поддержка i18n / l10n. Фильтр валюты использует символ валюты по умолчанию из службы locale и позиционирует его на основе настроек локали.

Итак, все дело в поддержке и настройке правильной локали.

<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 обратитесь к руководству разработчика .

Используя locale (как объясняется в ответе в этом потоке - в Валюта Angular Js, символ euro после ) кажется самым правильным способом сделать это, но это не кажется чтобы предложить гибкость, чтобы поместить символ валюты или имя, где вы хотите, относительно значения, на которое вы ссылаетесь. Если вам нужно иметь свой символ валюты после вашего значения, вы можете иметь отдельное поле 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}}.

fyi - в этом случае у меня, вероятно, есть отдельное поле product.currency и product.currencySymbol (например, «USD» и «$» соответственно), но затем вы получаете больше возможностей из locale, как указано в другом ответе, указанном выше. Но если вам нужно поместить название или символ валюты в другое место относительно значения, чем то, что Angular позволит вам делать через свои родные каналы, и хотите использовать валюту, специфичную для записи или настройки, с которой вы работаете без жесткого кодирования его символа или имени на странице (например, если у вас есть несколько валют, которые вы показываете), это один из способов сделать это динамически.

Вы можете создать фильтр:

app.filter('euroFormat', function () {
    return function (input) {
        return input+' \u20AC';
    };
});

и применить его к вашему html-коду с помощью:

<span>Price: {{product.price| euroFormat}}</span>

Это довольно старый вопрос, в наши дни все по другому. Возможно, это было тогда ...

Так что если кто-то еще найдет это.

Но вам нужно включить правильная локаль, чтобы получить правильное форматирование валюты в валютном фильтре.

Проверить угловую документацию, например, форматирование голландской валюты составляет 5,00 евро, а английский - 5,00 евро, а американец - 5,00 евро

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):

<span>Price: {{product.price| currency:""}} €</span>

DEMO

Пожалуйста, прочитайте реальный вопрос этого сообщения (валюта Angular Js, символ евро после), прежде чем downvote слишком быстро !!!!!