Ag-Grid: Number Formatage par exemple: 123456.78 à 123.457

Question

J'ai d'énormes ensembles de données numériques. cela doit être rendu en tant que valeur séparée par des virgules. Pour l'ex. 123456.78 pour être rendu comme 123,457 en utilisant Ag-Grid. Veuillez m'aider à y parvenir.

Answer 1

Vous pouvez le faire en écrivant un « CustomCellRenderer », lorsque vous créez une définition de colonne fournir une fonction « cellRenderer » attribut et filtre numéro d'utilisation de renderer, quelque chose comme ça

var colDef = { 
    name: 'Col Name', 
    field' 'Col Field', 
    cellRenderer: function(params) { 
     var eCell = document.createElement('span'); 
     var number; 
     if (!param.value || !isFinite(param.value)) { 
      number = ''; 
     } else { 
      number = $filter('number')(param.value, 0); 
     } 
     eCell.innerHTML = number; 
     return eCell; 
    } 
} 

Answer 2

{ 
     headerName: 'Salary', field: 'sal' 
     cellRenderer: this.CurrencyCellRenderer 
     } 

private CurrencyCellRenderer(params:any) { 

    var usdFormate = new Intl.NumberFormat('en-US', { 
     style: 'currency', 
     currency: 'USD', 
     minimumFractionDigits: 4 
    }); 
    return usdFormate.format(params.value); 
} 

Comme ceux-ci nous pouvons mentionner dans le code de tapuscrit de Angular2.

Answer 3

Selon la documentation de flux de rendu des cellules (here), vous pouvez utiliser le colDef.valueFormatter, comme ceci:

var columnDefs = [ 
    {headerName: "Number", field: "number"}, 
    {headerName: "Formatted", field: "number", valueFormatter: currencyFormatter} 
]; 

function currencyFormatter(params) { 
    return '£' + formatNumber(params.value); 
} 

function formatNumber(number) { 
    // this puts commas into the number eg 1000 goes to 1,000, 
    // i pulled this from stack overflow, i have no idea how it works 
    return Math.floor(number).toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,"); 
} 

Vous pouvez également utiliser un cellRenderer que d'autres messages décrivent, mais qui est généralement pour plus complexe rendu, alors que valueFormatter est spécifiquement pour ce cas. De l'ag-grille documentation:

valueFormatter sont pour la mise en forme du texte. CellRenderer sont pour lorsque vous souhaitez inclure le balisage HTML et potentiellement fonctionnalité à la cellule. Par exemple, si vous voulez mettre une ponctuation dans une valeur, utilisez un valueFormatter, si vous voulez mettre des boutons ou des liens HTML, utilisez un cellRenderer. Il est possible d'utiliser une combinaison des deux, , auquel cas le résultat de la valeur FormFormatter sera transmis à cellRenderer.