我需要帮助使用Knockout格式化数据绑定

我对Knockout相当陌生，并且正在寻找格式化输出的方式。我看到一个这样的例子，但我的尝试当然不起作用。我需要帮助使用Knockout格式化数据绑定

这里是链接到的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>

来源

2012-08-01 Jim

你可以考虑使用一个计算观察到：

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>

来源

2012-08-01 00:54:45 KodeKreachor

这将工作但不是我的使用案例的理想选择。我确实在Knkockout网站上找到了这个。 http://knockoutjs.com/examples/cartEditor.html它有一个像我想要的例子，但我仍然有问题让我的代码正常工作。我会继续堵塞。 – Jim 2012-08-01 02:53:21

就像这是一个片状的简单例子。我做了另一个简单的jsfiddle http://jsfiddle.net/cezmp/1/它是上面cartEditor演示的一个剥离版本。它在jsfiddle中不起作用，但它“适用于”我的网站上的测试html页面。 – Jim 2012-08-01 03:08:14

仔细看一下我上面的示例，计算出的observable会执行格式化，然后直接将数据绑定到元素的文本。这里是你的小提琴的更新：http://jsfiddle.net/cezmp/3/ – KodeKreachor 2012-08-01 04:12:26

如果你想要一个更通用的解决方案，你可以做这样的事情

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

编辑：您可以提供一个带有选项的对象文本，并使用isCurrency扩展器中的对象文本

来源

2012-08-01 07:58:08 Anders

我需要帮助使用Knockout格式化数据绑定

回答

相关问题