Ag-Grid: Zahlenformatierung zB: 123456.78 bis 123.457

Question

Ich habe riesige Mengen von numerischen Daten. Dies muss als kommagetrennter Wert gerendert werden. Für Ex. 123456.78 als 123,457 mit Ag-Grid gerendert werden. Bitte helfen Sie mir, dies zu erreichen.

Answer 1

Sie können dies tun, indem Sie eine „Custom“ zu schreiben, wenn Sie eine Spaltendefinition Verwendung Anzahl Filter, so etwas wie dieses

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

Wie eine Funktion „cellrenderer“ -Attribut und in Renderer bieten erstellen Diese können wir in Angular2 Typescript-Code erwähnen.

Answer 3

Gemäß der Zelle Rendering Fluss Dokumentation (here), können Sie die colDef.valueFormatter wie folgt verwenden:

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,"); 
} 

Sie könnten auch einen cellrenderer verwenden als andere Beiträge beschreiben, aber das ist typisch für komplexere Rendering, während der ValueFormatter speziell für diesen Fall ist. Aus dem ag-grid documentation:

WertFormatter sind für die Textformatierung. CellRenderer sind für, wenn Sie HTML Markup und möglicherweise Funktionalität in die Zelle einfügen möchten. Wenn Sie zum Beispiel Satzzeichen in einen Wert setzen möchten, verwenden Sie einen WertFormatter, wenn Sie Schaltflächen oder HTML-Links verwenden möchten, verwenden Sie einen CellRenderer. Es ist möglich, eine Kombination von beiden zu verwenden. In diesem Fall wird das Ergebnis von valueFormatter an den cellRenderer übergeben.