Valueupdate 在 keyup 上计算的 observable，但不是它所依赖的 observable答案

【问题标题】：Valueupdate a computed observable on keyup, but not observable(s) it relies onValueupdate 在 keyup 上计算的 observable，但不是它所依赖的 observable
【发布时间】：2013-09-26 00:43:54
【问题描述】：

我有一个 computedObservable，它依赖于另一个与文本输入相关的 observable 的值。像这样，hasValidAlmUrl 是 computedObservable：

<input type="text" data-bind="value: selectedArchive().almUrl" />
<button type="button" data-bind="enable: hasValidAlmUrl">Test</button>

我的淘汰视图模型如下所示：

function ArchiveViewModel() {
    var self = this;
    self.selectedArchive = ko.observable(new ArchiveData());
    self.hasValidAlmUrl = ko.computed(function () {
        var almUrl = self.selectedArchive().almUrl();
        if (typeof (almUrl) == 'undefined') return false;
        return almUrl.length > 0;
    }, self);
    ...
};

hasValidAlmUrl computedObservable 目前可以正常工作，但我希望它在<input> 的keydown 事件上更新，而不是在<input> 的焦点发生变化时更新。我可以通过在<input> 上添加valueUpdate: 'afterkeydown' 来实现此功能。

我不喜欢的是这些元素是模态的。模态叠加层后面是一个实体列表，填充模态中的实体是其中的一部分。当我将<input> 设置为valueUpdate: 'afterkeydown' 时，您可以看到模态背后的网格随着输入值的变化而变化，我认为这看起来很糟糕。

有什么方法可以在它所依赖的可观察对象的 keydown 上计算可观察更新，但在 keydown 上没有相关的可观察更改？

【问题讨论】：

标签： knockout.js

【解决方案1】：

创建一个新的可观察对象来保存您的临时输入，并在某些事件（焦点、应用等）上将该值复制到您的原始可观察对象中：

self.tmpAlmUrl = ko.observable(); // bind your input to this
self.hasValidAlmUrl = ko.computed(function () {
     return (typeof (self.tmpAlmUrl()) !== 'undefined') && self.tmpAlmUrl().length;
});

// call when about to show the modal
self.onDisplayModal = function () {
    self.tmpAlmUrl(self.selectedArchive().almUrl();
});

// call when you want to "apply" the new url
self.onApplyChanges = function () {
    self.selectedArchive.almUrl(self.tmpAlmUrl());
};

【讨论】：