Knockoutjs：同时使用单击和检查绑定时的绑定评估顺序

Question

我不知道如何在与click 绑定关联的方法中访问已由checked 绑定更新的值？

似乎checked 绑定在click 绑定之后进行评估，因为在click 绑定方法/处理程序中我无法访问computed 属性值，该值取决于与checked 绑定同步的数组。

单个复选框的模板：

<script id="singleFilterTemplate" type="text/html">
    <li>
        <input type="checkbox" data-bind="attr: { value: id }, 
                                          click: $root.testMethod,
                                          checked: $parent.selectedFilterIds">
    </li>
</script>

我遵循视图模型的层次结构：

- TopLevelViewModel ($root in template above, defines computed aggregatedSelectedIds property)
---- GroupViewModel_0 ($parent in template above)
-------FilterViewModel_0_0 (Each FilterViewModel is associated with a check box)
-------FilterViewModel_0_N 
---- GroupViewModel_N
-------FilterViewModel_N_0 
-------FilterViewModel_N_N 

• checked: $parent.selectedFilterIds：每次选中/取消选中复选框时 - TopLevelViewModel.selectedFilterIds 数组中的相应项目都会更新
• click: $root.testMethod：在单击复选框时，我试图获取所有复选框的当前状态，为此我引入了计算属性 aggregatedSelectedIds，它运行良好并代表所有 GroupViewModel.selectedFilterIds 值的聚合状态，基本上它将所有 selectedFilterIds 属性中的元数据聚合为一个值，在 testMethod() 中我只是调用 alert(topLevelViewModel.aggregatedSelectedIds()) 以确保此属性表示当前选定过滤器的列表。

所以每次testMethod() 由click 绑定调用 - 我看到过滤器的先前状态（值，由aggregatedSelectedIds 计算）。那么有什么方法可以在click 绑定之前强制/推送/评估checked 绑定？我尝试了event 绑定，但得到了相同的结果。也许我做错了，错过了一些明显的东西？

Answer 1

您可以通过以下方式订阅对 selectedFilterIds 的更改

this.selectedFilterIds  = ko.observable();
this.selectedFilterIds.subscribe(function (value) {
    //Code from your click method goes here
});

Answer 2

由于选中复选框将基本上同时触发选中和点击事件，浏览器只是决定它会首先触发其中一个处理程序，因此一个简单的解决方法是在您的点击处理程序中使用超时。

setTimeout(function() { stuff }, 1) 之类的东西应该可以工作。

把它放在你的点击处理程序中会“跳”出处理程序，让被检查的处理程序触发并执行，然后它会返回到你的超时回调中的代码（如果你的检查处理程序很快，在等待 1ms 之后足以在此之前完成，我对此表示怀疑）

即使检查的处理程序首先在其他浏览器中触发，此解决方案仍然可以正常工作。

Answer 3

通常，方法会按照您的顺序绑定和执行.. 绑定它们.. 看起来您首先绑定点击。不知道从数据绑定属性中敲除js如何处理这个？

例如

$(this).click(function () { alert(1);})
    .click(function() {alert(2);});

// alert(1) is first 

我知道那是 jquery，但是纯 js 中的事件绑定也是如此。

真正做到这一点的最好方法是延迟或承诺，但我不知道这在 knockoutjs 中是如何工作的:(