Knockout.js computed

Knockout.js computed

本文关键字:computed js Knockout      更新时间:2023-09-26

我正在使用Knockout.js开发计算器。我正面临着一个我不知道如何处理的局面。在下面的示例中,当用户输入产品和值并将值保存在DB中时,一切都工作正常。但是当用户来编辑这个页面时,我的要求是显示用户输入的所有值以及总数。但当用户改变产品或数量时,总量应该按预期变化。

我们现在将total存储在DB中,并且total可以被一些管理员用户更改。在这种情况下,是否有一种方法可以在用户进入编辑页面时重写计算值,但当用户更改product或quantity时,则计算应该使用product和quantity的最新值。

感谢您的帮助。

var TsFoundationDeviceModel = function(product,qty) {
var self = this;
self.product = ko.observable();
self.quantity= ko.observable();
self.computedExample = ko.computed(function() {
   return self.product() * self.quantity() ;
});}

我的HTML代码看起来像

<input name="product" data-bind="value:product">
<input name="value" data-bind="value:value">
<input name="total" data-bind="value:computedExample"/>

必须将视图绑定到屏幕上。看看这个小提琴,给它

 var TsFoundationDeviceModel = function(product,qty) {
var self = this;
self.product = ko.observable(product);
self.quantity= ko.observable(qty);
self.computedExample = ko.computed(function() {
 return self.product() * self.quantity() ;
});}
ko.applyBindings(new TsFoundationDeviceModel(2,3));
http://jsfiddle.net/Z6VPV/5/

当你在计算中引用可观察对象时,你需要将它们视为函数,所以你将使用return self.product() * self.quantity();而不是return self.product * self.quantity ;

小提琴:http://jsfiddle.net/SAV9A/