javascript - Knockout.js 仅在值更改时启用保存

Question

我有一个带有值输入和保存按钮的简单 html 页面。我希望只有在更改值时才会启用保存(有时会初始化，有时不会。

我试过一些东西都没有成功

HTML

<input type="text"
    placeholder="type here"
    data-bind="value: rate,"/>
<button data-bind="click: save">Save</button>

JS

    var viewmodel = function () {
        this.rate = ko.observable('88').extend(required: true);
    };

    viewmodel.prototype.save = function () {
        alert('save should be possible only if rate is changed);
    };

也在 jsfiddle 上

Answer 1

应该能够通过计算的可观察对象和 enable 绑定(bind)来实现这一点。参见 http://jsfiddle.net/brendonparker/xhLrB/1/

Javascript:

var ctor = function () {
    var self = this;
    self.originalRate = '88';
    self.rate = ko.observable('');
    self.canSave = ko.computed(function(){
        return self.originalRate == self.rate();
    });
};

ctor.prototype.save = function () {
    alert('save should be possible only if rate is changed');
};

ko.applyBindings(new ctor());

HTML:

<input type="text" placeholder="type here" data-bind="value: rate, valueUpdate: 'afterkeydown'"/>
<button data-bind="click: save, enable: canSave">Save</button>