可自动计算属性(Value转换器)

//Value转换器
//有时候你可能需要显示一些不同格式的数据,从基础的数据转化成显示格式。
//eg 你存储价格为float类型,但是允许用户编辑的字段需要支持货币单位和小数点。你可以用可写的自动属性来实现,然后解析传入的数据到基本
//float类型里:

<pre>

function MyViewModel()
{
this.price = ko.observable(25,99);

this.formattedPrice = ko.computed({ 
   
   read:function(){ 
    
   return '$'+this.price().toFixed(2);
    
    
},
  write:function(value){

      
      value = parseFloat(value,replace(/[^\.\d]/g,""));
      
      this.price(isNaN(value)? 0:value); 
      
  },
  
  owner: this 
});

}

ko.applyBinding(new MyViewModel());

</pre>
<pre>
<code>
<p>Enter bid price: <input data-bind="value: formattedPrice"/></p>

<code>

</pre>

//所以,不管用户什么时候输入新价格,输入什么格式,text box里会自动更新为带有2位小数点和货币符号的数值。

//这样用户可以看到你的程序有多聪明,来告诉用户只能输入2位小数,否则的话自动删除多余的位数,当然也不能输入负数,

//因为 write 的callback函数会自动删除负号。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容