Moeda angular Js, símbolo euro depois

Como mover o símbolo euro da frente do valor para depois dele?

Exemplo:

{{product.price | currency : "€"}} {{product.price | currency : "€"}} produzirá € 12.00

mas eu gostaria de 12.00 €

Você não precisa hackear o filtro de moeda!

O AngularJS tem um ótimo suporte para o i18n / l10n. O filtro de moeda usa o símbolo monetário padrão do serviço de local e o posiciona com base nas configurações de localidade.

Então, é tudo sobre como apoiar e definir o local certo.

  

Se você estiver usando npm ou bower todos os locais estarão disponíveis através do pacote angular-i18n .

 {{ product.price | currency }} 

agora produzirá a seguinte saída:

 65,95 € 

Suportando várias localizações

Se você deseja oferecer suporte a várias localizações, tenha cuidado com o símbolo da moeda, pois ele é alterado para a moeda padrão da localidade usada. Mas 65,95 € são diferentes para $65,95 . Forneça o símbolo da moeda como parâmetro para ser seguro:

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

Na de-de saída ainda seria 65,95 € mas se a localização é por exemplo. en-us seria €65.95 (apesar de alguns outros dizeres o formato correto para exibir os preços do euro em Inglês ).

Para saber mais sobre o angular e o i18n / l10n, consulte o guia do desenvolvedor .

Você não pode com o filtro de moeda. Você poderia escrever o seu próprio, ou apenas usar o filtro numérico.

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

As soluções propostas estão todas sujas.

Primeiramente, o filtro permite alterar o símbolo, adicionando-o como parâmetro:

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

mas o caminho certo é localizar seu aplicativo como sugerido por @Andreas se você localizar seu aplicativo por exemplo com configuração de localidade italiana (it-it) dentro de seu aplicativo, você só precisa invocar o filtro para obter o sinal de €.

 {{product.price | currency }} 

Configuração de localidade italiana colocar o sinal de Euro antes do valor da moeda. Você pode alterar o valor da localidade, ou muito melhor substituí-los, conforme proposto na resposta vinculada a seguir:

Por que o filtro de moeda AngularJS formata números negativos com parênteses?

você pode replace a configuração de localidade colocando seu símbolo de moeda (\ u00A4) como um prefixo ou sufixo para valor positivo e negativo também.

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

então depois desta instrução o filtro:

 {{product.price | currency}} 

produzirá a saída a seguir

 € 12 

use este truque.

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

É uma questão bastante antiga, é diferente nos dias de hoje .. Talvez tenha sido naquela época também ..

Então, se alguém achar isso …

Mas você precisa include a localidade correta para obter a formatação de moeda correta no filtro de moeda.

Verifique a documentação angular, por exemplo, a formatação da moeda holandesa é de € 5,00 Enquanto o inglês é de 5,00 € e o americano é de € 5,00

A Angularjs tem um grande suporte para internacionalização e localização. A aplicação da internacionalização e localização depende do escopo de sua aplicação. Por exemplo, se a sua aplicação só suporta euro, então você precisa apenas da localização para o euro e não exige toda a moeda e a sua formatação.

Em tal situação (supondo que sua situação é semelhante à acima), você pode criar uma configuração de aplicativo e definir localidade como a localização necessária, usando alguns decoradores. Uma function de decorador intercepta a criação de um serviço, permitindo replace ou modificar o comportamento do serviço.

 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; }]) 
  
Price : {{price | currency}}

Usando o locale (como explicado na resposta neste tópico – na moeda Angular Js, símbolo euro depois ) parece ser a maneira mais correta de fazê-lo, mas não parece oferecer a flexibilidade de colocar o símbolo da moeda ou nome onde você quer em relação ao valor que você está referenciando. Se você precisar ter o seu símbolo de moeda após o seu valor, você pode ter um campo product.currency separado e interpolar isso depois (ou antes) do valor do seu preço.

Portanto, se você tiver product.price = 40 e product.currency = '€' , poderá exibi-lo como 40 € com {{product.price}} {{product.currency}} . Ou € 40 revertendo os campos: {{product.currency}} {{product.price}} .

Você provavelmente deseja formatar os valores de product.price através do tubo decimal se você fez isso ( https://angular.io/api/common/DecimalPipe ). – Então “40,00 €” seria: {{product.amount | number:'2.2-2'}} {{product.currency}} {{product.amount | number:'2.2-2'}} {{product.currency}} .

fyi – neste caso, eu provavelmente teria um campo separado product.currency e product.currencySymbol (por exemplo, “USD” e “$”, respectivamente), mas, em seguida, você está obtendo mais informações sobre a funcionalidade da locale conforme mencionado na outra resposta eu linkar acima. Mas se você precisar colocar o nome ou o símbolo da moeda em um local diferente do valor que o Angular permitirá fazer por meio de seus canais nativos e desejar usar uma moeda específica para um registro ou conjunto com o qual você está trabalhando sem codificar seu símbolo ou nome na página (por exemplo, se você tiver várias moedas exibidas), essa é uma maneira de fazer isso dinamicamente.

Você pode criar um filtro:

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

e aplique-o no seu código html com:

 Price: {{product.price| euroFormat}} 

Eu uso esta solução no meu projeto (em produção) na França ( deve SEMPRE mostrar 5.00 €, NUNCA mostrar € 5.00 ):

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

DEMO

Por favor, leia a verdadeira questão deste post ( Angular Js moeda, símbolo euro depois ) antes downvote muito rapidamente !!!!!