带限制的 knockoutjs 值绑定答案

【问题标题】：knockoutjs value binding with restriction带限制的 knockoutjs 值绑定
【发布时间】：2013-11-01 03:35:44
【问题描述】：

我正在使用 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"/>

【问题讨论】：

标签： jquery knockout.js

【解决方案1】：

你应该使用计算淘汰赛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"/>

【讨论】：

【解决方案2】：

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

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

【讨论】：