javascript - 如何忽略用户未完成的更改？

Question

我的 View 模型中有一个 ko.observable，它附加到输入。当用户更改该输入的值(每个字符)时，我运行 AJAX 调用，从后端下载建议。

当用户选择其中一个建议时，我想用所选值填充输入，但不发送 AJAX 调用。但是设置 observable 的值仍然会触发事件并调用附加到 textInput 绑定(bind)的函数。

如何在不触发 textInput 的情况下设置 observable 的值？

示例代码:

var name = ko.observable();
name.subscribe(nameChanged);

var nameChanged = function() {
    someService.post(name(), success, failure);
}

var someAction = function() {

    name("Test"); // I don't want to trigger AJAX call here
}

<input type="text" data-bind="textInput: name" />

Answer 1

另一种选择是使用计算的可观察量作为中介。 ajax 函数可以在计算的写入事件中触发，以便直接写入 observable 绕过它。

function viewModel(){
    var self = this;
    
    self.realName = ko.observable('test');
    
    self.Name = ko.computed({
        read: function(){
            return self.realName();
        },
        write: function(value){
            self.realName(value);
            nameChanged(value);
        }
    });
    
    function nameChanged(newName) {
        console.log("name changed:", newName);
    }
    
    self.modifyName = function(){
        self.realName(self.realName() + 'z');
    }
}

ko.applyBindings(new viewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>


<input type="text" data-bind="textInput: Name" />
<br />
<button data-bind="click: modifyName">Modify</button>