Knockout:如何对两个数字输入进行双向绑定
Knockout: How to do a two-way binding for two number inputs
最近刚接KO,想做类似下面的事情
有两个输入,它们互相改变。
HTML:
<input data-bind="value: var1" type="text">
<input data-bind-"value: var2" type="text">
脚本:
function DataViewModel() {
var self = this;
self.price = 5;
self.var1 = ko.observable(0);
self.var2 = ko.computed({
read: function () {
if(self.var1() <= 0) {
return 0;
}
return (self.var1 - 1) / self.price;
},
write: function (value) {
self.var1((Number(value) + 1) * self.price);
// Value = 7.8, output is 44 for var1,
// var2 changes to 8.6. Desired is 40 for var1 and 7.8 for var2.
},
owner: self
});
}
ko.applyBindings(new DataViewModel());
var1输入40,var2显示7.8。但是当 7.8 输入到 var2 时,var1 更新为 44 而不是 40,var2 变为 8.6.
我希望 var2 保留输入的内容而不是进行读取功能。
这个表达式不正确
write: function (value) {
self.var1((value+1) * self.price);
},
试试这样更新
write: function (value) {
self.var1((value * self.price) + 1);
},
最近刚接KO,想做类似下面的事情
有两个输入,它们互相改变。
HTML:
<input data-bind="value: var1" type="text">
<input data-bind-"value: var2" type="text">
脚本:
function DataViewModel() {
var self = this;
self.price = 5;
self.var1 = ko.observable(0);
self.var2 = ko.computed({
read: function () {
if(self.var1() <= 0) {
return 0;
}
return (self.var1 - 1) / self.price;
},
write: function (value) {
self.var1((Number(value) + 1) * self.price);
// Value = 7.8, output is 44 for var1,
// var2 changes to 8.6. Desired is 40 for var1 and 7.8 for var2.
},
owner: self
});
}
ko.applyBindings(new DataViewModel());
var1输入40,var2显示7.8。但是当 7.8 输入到 var2 时,var1 更新为 44 而不是 40,var2 变为 8.6.
我希望 var2 保留输入的内容而不是进行读取功能。
这个表达式不正确
write: function (value) {
self.var1((value+1) * self.price);
},
试试这样更新
write: function (value) {
self.var1((value * self.price) + 1);
},