0

我有一个淘汰视图模型，其中包含一个可观察的“重量”数组，如下所示

var Weight = function(item){
var self = this;
self.weight = ko.observable(item);
self.lbs = ko.computed({
    read: function () {
        return Math.floor(self.weight() / ozInLbs);
    },
    write: function (newValue) {
        self.weight((((newValue * ozInLbs) + parseFloat(self.oz())).toFixed(3)*1000)/1000);
    },
    owner: self
});
self.oz =  ko.computed({
    read: function () {
        return ((self.weight() - self.lbs() * ozInLbs).toFixed(3)*1000)/1000;
    },
    write: function (newValue) {
        self.weight(((newValue + (self.lbs() * ozInLbs)).toFixed(3)*1000)/1000);
    },
    owner: self
});

}

带有以下 html

<table>
<thead>
    <tr>
        <td>lbs</td>
        <td>oz</td>
    </tr>
</thead>
<tbody data-bind="foreach: weights">
<tr>
    <td><input type="text" data-bind="spinner:lbs" /></td>
    <td><input type="text" data-bind="spinner:oz" /></td>
</tr>

想法是，当我用微调器增加盎司时——一旦击中 16 盎司——磅增加一，盎司回到零。这适用于以下 jsfiddle：http: //jsfiddle.net/ajwaka/Ps36B/

现在 - 因为这些本质上是文本输入'我想允许用户添加 1.25 磅 - 并让它自动将输入更新为 LBS - 1 和 OZ = 4

问题是 - 一旦我达到 1.2 - 一切都会自动更新，我得到 Lbs = 1 和 Oz = 3。当用户输入值 1.25 时，我怎样才能让它延迟 1/2 秒我得到磅 = 1 和盎司 = 4？

需要明确的是 - 我想在使用微调器时保持即时更新 - 但如果用户通过键盘/键盘输入值，则会延迟用户输入。

4

1 回答 1

2

您可以使用Throttle 的. 油门会阻止更新实际发生，直到该值在指定的时间内保持静止。这是您使用 500 毫秒油门的小提琴。

代码如下所示：

self.lbs = ko.computed({
        read: function () {
            return Math.floor(self.weight() / ozInLbs);
        },
        write: function (newValue) {
            self.weight((((newValue * ozInLbs) + parseFloat(self.oz())).toFixed(3)*1000)/1000);
        },
        owner: self
    }).extend({ throttle: 500 });
于 2012-11-21T19:25:34.947 回答