Question

如何将符号欧元从值的前面移到后面？

示例：

{{product.price | currency : "€"}}将生成€ 12.00

但我希望12.00 €

Answer 1

您不必破解货币过滤器！

AngularJS对i18n / l10n有很大的支持。货币过滤器使用区域设置服务中的默认货币符号，并根据区域设置对其进行定位。

所以关于支持和设置正确的语言环境。

<script src="i18n/angular-locale_de-de.js"></script>

如果您使用的是npm或bower，则angular-i18n package可以使用所有语言区域。

<span>{{ product.price | currency }}</span>

现在将产生以下输出：

65,95 €

支持多个本地化

如果要支持多个本地化，请小心使用货币符号，因为它会更改为使用的区域设置的默认货币。但65,95 €与$65,95不同。提供货币符号作为安全参数：

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

在de-de中，输出仍然是65,95 €，但如果位置是例如。 en-us它会€65.95（尽管有其他一些说法the correct format to display euro prices in English）。

要了解有关angular和i18n / l10n的更多信息，请参阅developer guide。

Answer 2

您无法使用货币过滤器。你可以自己编写，或者只使用数字过滤器。

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

Answer 3

使用这个技巧。

<div>{{product.price | currency : '' }} €</div>

Answer 4

提议的解决方案都很脏。

首先，过滤器允许通过将其添加为参数来更改符号：

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

但正确的方法是根据@Andreas的建议本地化您的应用如果您在应用程序中本地化您的应用程序，例如使用意大利语语言环境设置（it-it），则只需调用过滤器即可获得€符号。

{{product.price | currency }}

意大利语区域设置将欧元符号放在货币值之前。您可以更改che语言环境值，或者更好地覆盖它们，如以下链接答案中所建议的那样：

Why AngularJS currency filter formats negative numbers with parenthesis?

您可以覆盖区域设置，将您的货币符号（\ 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

Answer 5

Angularjs对国际化和本地化有很大的支持。国际化和本地化的应用取决于您的应用范围。例如，如果您的应用程序仅支持欧元，那么您只需要欧元的本地化，并且不需要所有货币及其格式。

在这种情况下（假设您的情况与上述类似），您可以创建应用程序配置并将区域设置设置为使用某些装饰器所需的本地化。装饰器函数拦截服务的创建，允许它覆盖或修改服务的行为。

＆＃13;

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;
  }])

＆＃13;

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

＆＃13;

以上配置显示了十进制和货币设置的所有可能值。您可以根据应用级别的要求进行更改。

如果你不希望效果在整个应用程序中更好，那就是去指令

Answer 6

这是一个相当古老的问题，这些日子有所不同......也许它当时也是如此......

所以，如果其他人发现了这个......

但是您需要包含正确的区域设置才能在货币过滤器中获得正确的货币格式。

检查角度文档，例如荷兰语货币格式为€5,00而英语为5,00€且美国为€5.00

Answer 7

使用locale（如本主题中的答案所述 - 在Angular Js currency, symbol euro after）似乎是最正确的方法，但它似乎没有灵活性将货币符号或名称放在你想要的位置相对于你的价值引用。如果您需要在价值后面加上货币符号，则可以有一个单独的product.currency字段，并在价格值之后（或之前）进行插值。

因此，如果您有product.price = 40和product.currency = '€'，则可以使用{{product.price}} {{product.currency}}将其显示为40€。或者翻转字段40欧元：{{product.currency}} {{product.price}}。

如果您这样做（https://angular.io/api/common/DecimalPipe），您可能希望通过小数管格式化product.price值。 - 所以“40.00€”将是：{{product.amount | number:'2.2-2'}} {{product.currency}}。

fyi - 在这种情况下，我可能会有一个单独的字段product.currency和product.currencySymbol（例如分别为“USD”和“$”），但随后您将获得更多功能我在上面链接的另一个答案中引用的locale。但是，如果您需要将货币名称或符号放在相对于该值的不同位置，而不是Angular允许您通过其本机管道执行的操作，并且希望使用特定于您正在使用的记录或集合的货币如果没有在页面上对其符号或名称进行硬编码（例如，如果您正在显示多种货币），这是动态执行此操作的一种方法。

Answer 8

我在法国的项目（生产中）中使用此解决方案（它必须总是显示5.00€，绝不显示€5.00 ）：

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

DEMO

请先阅读这篇文章的真实问题（ Angular Js货币，符号之后的符号欧元），然后再快速下挫!!!!!

Answer 9

您可以创建过滤器：

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

并将其应用于您的html代码：

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

Angular Js货币，符号欧元之后

9 个答案: