Ho bisogno di aiuto per formattare un data-bind usando Knockout

Sono abbastanza nuovo su Knockout e sto cercando il modo di formattare l'output. Ho visto un esempio simile a questo, ma ovviamente il mio tentativo non funziona.Ho bisogno di aiuto per formattare un data-bind usando Knockout

Ecco il link al jsfiddle: http://jsfiddle.net/cezmp/

<div id="VMDiv">  
<table> 
    <thead> 
     <tr> 
     <th>Raw</th> 
     <th>Formatted</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td data-bind="text : SomeData "> </td> 
      <td data-bind="text : formatPercent(SomeData())"> </td> 
     </tr> 
    </tbody> 
</table> 
</div> 


<script type="text/javascript"> 
    function formatPercent(value) { 
     return value.toFixed(2) + "%"; 
    } 

    function vm() { 
     var self = this; 
     self.SomeData = ko.observable(62.1795972898); 
    } 

    ko.applyBindings(new vm(), document.getElementById("VMDiv")); 
</script>

fonte

2012-08-01 Jim

Si potrebbe considerare l'utilizzo di un Computerizzata osservabile:

div id="VMDiv">  
<table> 
<thead> 
    <tr> 
    <th>Raw</th> 
    <th>Formatted</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td data-bind="text : SomeData "> </td> 
     <td data-bind="text : SomeDataFormatted"> </td> 
    </tr> 
</tbody> 
</table> 
</div> 

<script type="text/javascript"> 
    function vm() { 
     var self = this; 
     self.SomeData = ko.observable(62.1795972898); 
     self.SomeDataFormatted = ko.computed(function(){ 
      return self.SomeData().toFixed(2) + "%"; 
     }); 
    } 

    ko.applyBindings(new vm(), document.getElementById("VMDiv")); 
</script>

fonte

2012-08-01 00:54:45 KodeKreachor

Questo funzionerà, ma non è l'ideale per il mio caso d'uso. L'ho trovato sul sito di Knkockout. http://knockoutjs.com/examples/cartEditor.html Ha un esempio come volevo ma ho ancora problemi nel far funzionare correttamente il mio codice. Continuerò a tappare. – Jim

Proprio come un rapido esempio di come questo sia sfocato. Ho creato un altro semplice jsfiddle http://jsfiddle.net/cezmp/1/ È una versione spogliata della demo di cartEditor sopra. Non funziona in jsfiddle ma "funziona" sulla mia pagina html test sul mio sito. – Jim

Osservando più da vicino il mio esempio precedente, l'osservabile calcolato fa la formattazione e quindi è direttamente in formato databound al testo del tuo elemento. Ecco un aggiornamento per il tuo violino: http://jsfiddle.net/cezmp/3/ – KodeKreachor

Se si desidera una soluzione più generico si può fare qualcosa di simile

(function() { 

    ko.extenders.isCurrency = function (target, options) { 
     var result = ko.dependentObservable({ 
      read: function() { 
       return Globalize.format(target(), "c"); 
      }, 
      write: target 
     }); 


     result.raw = target; 
     return result; 
    }; 
}()); 


ViewModel = function() { 
    this.cashIsKing = ko.observable(565345.56435535).extend({ isCurrency: true}); 
}; 

ko.applyBindings(new ViewModel());

http://jsfiddle.net/5H5AK/

edit: Invece di usare vero come le opzioni, è possibile fornire un oggetto letterale con le opzioni e l'uso che dal isCurrency extender

fonte

2012-08-01 07:58:08 Anders

Ho bisogno di aiuto per formattare un data-bind usando Knockout

risposta

Problemi correlati