Come posso formattare il decimale in formato valuta nei baffi?

Question

Sto utilizzando i baffi per eseguire il rendering dei dati JSON ricevuti tramite Ajax.

Voglio rendere questo numero in formato valuta:

{{price}}

esempio: 12300

Come posso renderlo come:

"12,300"

utilizzando il motore di baffi di template ?

Answer 1

Dovresti farlo prima di passare il tuo modello ai baffi (o qualsiasi motore di template in realtà). Oltre a essere in grado di eseguire operazioni stringa, il problema è che non tutti i Paesi formattano i numeri allo stesso modo, in modo che la rappresentazione della visualizzazione possa essere diversa e non dovrebbe essere codificata nel modello.

Answer 2

Moustache è molto minimalista e non fornisce alcun supporto per questo.

hai di fornire i dati formattati o una funzione che restituisce i dati formattati

{ priceDecimal: function() { return formatDecimal(this.price); } } 

Un'altra alternativa è quella di utilizzare handlebars.js che supporta le funzioni di supporto

Handlebars.registerHelper('decimal', function(number) { 
    return formatDecimal(number); 
}); 

e utilizzarlo come questo

{{decimal price}} 

Answer 3

Mentre concordo con Lucero's answer, è possibile utilizzare un function in Mustache per formattare i dati.

semplice modello:

<ul> 
    {{#price}} 
     <li>{{commaFormat}}</li> 
    {{/price}} 
</ul> 

JavaScript per elaborare i dati con una funzione di formattazione per i vostri prezzi:

var tpl = $('#tpl').html(), 
    data = { 
     price: ['1234', '123', '123456', '1234567890'], 
     commaFormat: function() { 
      // adapted from https://stackoverflow.com/questions/2901102/how-to-print-number-with-commas-as-thousands-separators-in-javascript 
      return this.replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
     } 
    }, 
    html = Mustache.to_html(tpl, data); 

document.write(html);​ 

HTML risultante:

<ul> 
    <li>1,234</li> 
    <li>123</li> 
    <li>123,456</li> 
    <li>1,234,567,890</li> 
</ul> 

Ecco the working jsFiddle per ispezionare e giocare con oltre.

Answer 4

Ho creato una piccola estensione per Mustache.js che abilita l'uso di formattatori all'interno di espressioni, come {{espressione | formattatore}}

È possibile controllare in github: http://jvitela.github.io/mustache-wax/

Answer 5

utilizzare il pacchetto di manubri NumeralHelper da https://www.npmjs.com/package/handlebars.numeral

In primo luogo, installare (e facoltativamente salvarlo sul pacchetto.JSON):

npm install --save handlebars.numeral 

Avanti, caricare l'aiutante:

var Handlebars = require('handlebars'); 
var NumeralHelper = require("handlebars.numeral"); 
NumeralHelper.registerHelpers(Handlebars); 

Infine, lo usano nella tua pagina:

<script> 
myNumber = 12300: 
</script> 

<div> 
{{ number myNumber }} 
</div> 

L'uscita per questo esempio è 12,300.