Necesito ayuda para formatear un enlace de datos usando Knockout

Soy bastante nuevo en Knockout y estoy buscando la forma de formatear el resultado. Vi un ejemplo que era algo como esto, pero por supuesto mi intento no funciona.Necesito ayuda para formatear un enlace de datos usando Knockout

Aquí está el enlace a la 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>

Fuente

2012-08-01 Jim

Se podría considerar el uso de un computada observables:

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>

Fuente

2012-08-01 00:54:45 KodeKreachor

Esto funcionará pero no es ideal para mi caso de uso. Encontré esto en el sitio de Knkockout. http://knockoutjs.com/examples/cartEditor.html Tiene un ejemplo como el que yo quería, pero todavía tengo problemas para que mi código funcione correctamente. Seguiré enchufándome. – Jim

Así como un ejemplo rápido de lo escamosa que es esto. Hice otro jsfiddle simple http://jsfiddle.net/cezmp/1/ Es una versión reducida de la demostración de cartEditor anterior. No funciona en jsfiddle pero funciona "algo así" en mi página html de prueba en mi sitio. – Jim

Eche un vistazo más de cerca a mi ejemplo anterior, el observable calculado hace el formateo y luego se vincula directamente al texto de su elemento. Aquí hay una actualización de tu violín: http://jsfiddle.net/cezmp/3/ – KodeKreachor

Si desea una solución más genérica que puede hacer algo como esto

(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/

editar: En lugar de utilizar true como opciones, puede proporcionar un literal de objeto con opciones y usarlo desde el extensor de isCurrency

Fuente

2012-08-01 07:58:08 Anders

Necesito ayuda para formatear un enlace de datos usando Knockout

Respuesta

Cuestiones relacionadas