Suppression des décimales / cents du filtre de devises AngularJS

Est-il possible de supprimer les décimales / cents de la sortie d’un filtre de devises? Je fais quelque chose comme ça:

{{Price | currency}}

Quelles sorties:

1 000,00 $

Au lieu de cela, j’aimerais:

1 000 $

Est-ce que cela peut être fait en utilisant le filtre de devise? Je sais que je peux append un signe dollar à un chiffre et que je pourrais écrire mon propre filtre, mais j’espérais qu’une méthode simple existe avec le filtre de devises existant.

Je vous remercie.

Mise à jour : à partir de la version 1.3.0 – currencyFilter: append fractionSize comme paramètre facultatif, voir commit et plunker mis à jour

 {{10 | currency:undefined:0}} 

Notez que c’est le deuxième paramètre, vous devez donc passer undefined pour utiliser le symbole de devise locale

Mise à jour : Notez que cela ne fonctionne que pour les symboles de devise affichés avant le numéro. A partir de la version 1.2.9, il rest encore codé à 2 décimales.

Voici une version modifiée qui utilise une copie du formatNumber de l’angle pour activer 0 fractionSize pour la devise.


Normalement, cela devrait être configurable dans la définition des parameters régionaux ou dans l’appel de currencyFilter, mais maintenant ( 1.0.4 ), il est codé en dur jusqu’à 2 décimales.

Filtre personnalisé:

 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.subssortingng(0, sep); } return value.subssortingng(0, sep) + ')'; }; } ]); 

Modèle:

 
{{Price | noFractionCurrency}}

Exemple:

  • Démo

Mise à jour : correction d’un bug lors du traitement des valeurs négatives

La question semble être assez ancienne et les réponses données sont bonnes. Cependant, il existe une autre solution alternative qui peut aussi aider (que j’utilise dans mes projets).

Cela fonctionne très bien avec le préfixe des symboles de devise ainsi que le suffixe du nombre pour les valeurs positives et négatives.

Filtre personnalisé:

 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}'), '') } }]) 

Modèle:

 
{{yourPrice| nfcurrency}}

Exemples pour différents parameters régionaux:

  • 10.00 (en-fr) -> 10 £
  • 20.00 (en-us) -> 20 $
  • -10,00 (en-us) -> (10 $)
  • 30.00 (da-dk) -> 30 kr
  • -30,00 (da-dk) -> -30 kr

S’il vous plaît jeter un oeil à la démo en direct pour les dollars américains et la couronne danoise .

Mettre à jour

Veuillez noter que cette solution de contournement convient à AngularJS 1.2 et aux versions antérieures de la bibliothèque. A partir d’ AngularJS 1.3, vous pouvez utiliser le formateur de devises avec un troisième paramètre spécifiant la taille de la fraction – “Nombre de décimales à arrondir à” .

Notez que pour utiliser le format de devise par défaut provenant de la localisation AngularJS, vous devez utiliser le symbole de devise (deuxième paramètre) défini sur undefined ( null ou vide ne fonctionnera PAS). Exemple de démos pour les dollars américains et la couronne danoise .

Une autre chose qui mérite d’être prise en compte est que si vous savez que vous ne disposez que d’un seul paramètre régional ou d’un seul type de devise, vous pouvez placer le symbole monétaire avant le numéro et utiliser le filtre numérique (pour la devise américaine).

  ${{Price | number:0}} 

Plus de solution rapide si vous ne souhaitez pas installer un nouveau filtre et ne posséder qu’une seule devise.

Il est tard mais peut-être peut-il aider quelqu’un

 {{value | currency : 'Your Symbol' : decimal points}} 

Voyons donc quelques exemples avec sortie

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

Voir la démo

Ceci est une autre solution similaire, mais elle supprime .00 décimal, mais laisse toute autre quantité décimale.

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.subssortingng(0,2)=='00' ? cents.subssortingng(2) : '.'+cents; // remove "00" cent amount return dollar + cents; }; }]); 

Une autre solution, celle-ci supprime les zéros à la fin et trouve le symbole monétaire approprié pour les devises les plus courantes:

{{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 {ssortingng=} symbol Currency symbol or identifier to be displayed. * @returns {ssortingng} 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': //Liarm de Gibraltar return '£'; case 'BRL': //Real armileñ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, ''); }; } ]); 

Solution pour la version angular <1.3, si vous utilisez i18n, le moyen le plus simple est de:

 $filter('number')(x,0) + ' ' +$locale.NUMBER_FORMATS.CURRENCY_SYM; 

De cette façon, vous avez le numéro formaté avec des séparateurs corrects et un symbole monétaire basé sur les parameters régionaux.

Pour AngularJS 1.2, vous pouvez combiner simplement des filtres de number et de currency

 app.filter('noFractionCurrency', ['numberFilter', 'currencyFilter', function(numberFilter, currencyFilter) { return function(input, symbol) { var amount = numberFilter(input); return symbol + amount; }; }]); 

Et ici, si vous souhaitez arrondir au millier de dollars le plus proche: 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) { }); 

Exactement ce dont j’avais besoin!

J’ai ajouté une condition pour remplacer simplement le filtre de devises d’Angular et utiliser simplement une version modifiée du filtre vu ci-dessus par @Tom. Je suis sûr qu’il y a de meilleures façons de le faire, mais cela semble bien fonctionner pour moi jusqu’à présent.

 'use ssortingct'; 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}'), ''); } }; }]); 

J’ai modifié un peu le filtre posté par @Liviu T. pour accepter les devises avec un symbole après le nombre et un certain nombre de décimales:

 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 

Par exemple:

 {{10.234 | noFractionCurrency:0}} {{10.55555 | noFractionCurrency:2}} 

Les sorties:

 $10 $10.56 

Démo

Si vous utilisez angular-i18n ( bower install angular-i18n ), vous pouvez utiliser un décorateur pour modifier les valeurs par défaut dans les fichiers de parameters régionaux, comme ceci:

 $provide.decorator('$locale', ['$delegate', function ($delegate) { $delegate.NUMBER_FORMATS.PATTERNS[1].maxFrac = 0; $delegate.NUMBER_FORMATS.PATTERNS[1].minFrac = 0; return $delegate; }]); 

Notez que cela s’appliquerait à toutes les utilisations de filtres de devises dans votre code.