Suppression du filtre de devise AngularJS decimal/cents

Question

Existe-t-il un moyen de supprimer les décimales/cents de la sortie d'un filtre de devises ? Je fais quelque chose comme ceci :

<div>{{Price | currency}}</div>

Quelles sorties :

$1,000.00

A la place, j'aimerais :

$1,000

Cela peut-il être fait en utilisant le filtre des devises ? Je sais que je peux ajouter le signe du dollar à un nombre et que je pourrais écrire mon propre filtre, mais j'espérais qu'une méthode simple existait avec le filtre des devises existant.

Merci.

Answer 1

Mise à jour : à partir de la version 1.3.0 - currencyFilter : ajouter fractionSize comme paramètre optionnel, voir commettre et mis à jour plunker

{{10 | currency:undefined:0}}

Notez que c'est le deuxième paramètre, vous devez donc passer undefined pour utiliser le symbole de la monnaie locale actuelle.

Mise à jour : Notez que cela ne fonctionne que pour les symboles monétaires qui sont affichés avant le nombre. À partir de la version 1.2.9 c'est toujours codé en dur avec 2 décimales.

Ici est une version modifiée qui utilise une copie de formatNumber d'angular pour activer 0 fractionSize pour la monnaie.

---

Normalement, cela devrait être configurable soit dans la définition de la locale, soit dans l'appel au currencyFilter, mais pour l'instant( 1.0.4 ), il est codé en dur avec deux 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.substring(0, sep);
      }
      return value.substring(0, sep) + ')';
    };
  } ]);

Modèle :

<div>{{Price | noFractionCurrency}}</div>

Ejemplo:

• Demo

Mise à jour : correction d'un bug lors de la manipulation de valeurs négatives

Answer 2

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

Cela fonctionne très bien avec les symboles monétaires qui préfixent et suffixent le 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 :

<div>{{yourPrice| nfcurrency}}</div>

Exemples pour différents pays :

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

Veuillez consulter la démo en direct pour dollars US y Couronne danoise .

Mise à jour

Veuillez noter que cette solution de contournement est valable pour AngularJS 1.2 et les versions antérieures de la bibliothèque. A partir de AngularJS 1.3 vous pouvez utiliser devise formateur avec troisième paramètre spécifiant la taille de la fraction - "Nombre de décimales pour arrondir le montant à" .

Notez que pour utiliser le format de devise par défaut provenant de la localisation d'AngularJS, vous devez utiliser le symbole de la devise (deuxième paramètre) défini comme suit undefined ( null o vide ne fonctionnera PAS). Exemple dans les démos pour dollars US y Couronne danoise .

Answer 3

Si vous savez que vous n'avez qu'une seule région ou qu'un seul type de devise, vous pouvez placer le symbole de la devise avant le nombre, puis utiliser le filtre numérique comme suit (pour la devise américaine).

  ${{Price | number:0}}

C'est plutôt une solution rapide si vous ne voulez pas acheter un nouveau filtre et que vous n'avez qu'une seule devise.

Answer 4

Il s'agit d'une autre solution similaire, mais elle supprime la décimale .00, mais laisse tout autre montant décimal.

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

Answer 5

Une autre solution, celle-ci supprime les zéros de 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 {string=} symbol Currency symbol or identifier to be displayed.
 * @returns {string} 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': //Libras de Gibraltar
            return '£';

        case 'BRL': //Real brasileñ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, '');
};
} ]);