knockoutjs值限制绑定

时间:2013-10-31 19:20:33

标签: jquery knockout.js

我正在使用knockoutjs来实现购物车。 其中一个要求是允许客户更改项目数量。所以我自然而然地做了

<input type="text" data-bind="value: quantity"/>

在我的视图模式中,我将Item ViewModel定义为

Item = function(){
    ...
    _self.quantity = ko.observable(1);
    ...
}

但是还有一个要求是购物车中的总金额应该有一个上限。

我可以使用jquery拦截“更改”事件并在那里添加一些逻辑,但我想知道是否有任何本地淘汰方式可以做类似的事情

<input type="text" data-bind="value: quantity where quantity*uniprice <= maxDollarAmount"/>

2 个答案:

答案 0 :(得分:4)

你应该使用计算出的淘汰赛observables

视图模型:

Item = function(){
    ...
    _self.quantity = ko.observable(1);
    _self.attemptedQuantity = ko.computed({
        read: function () {
            return _self.quantity();
        },
        write: function (value) {
            if (value * uniprice <= maxDollarAmount) {
                self.quantity(value);
            } else {
                // alert or something
            }
        }
    });
    ...
}   

HTML:

<input type="text" data-bind="value: attemptedQuantity"/>

答案 1 :(得分:2)

改为使用计算的observable。它让你编写逻辑来处理你绑定的值。

http://knockoutjs.com/documentation/computedObservables.html