在 bootstrap 模式中的 ko.applyBindings 之后，敲除绑定不适用于启用按钮

Question

我试图在选中一个复选框后启用一个按钮，元素处于模式中。我正在使用 MVC，并且我在主要绑定之后添加了可观察对象，以便将它们与这样的模态一起使用

<script type="text/javascript">
    var Model = function () {
        self.check = ko.observable(false);   
    };

    $(document).ready(function () {
        ko.cleanNode($('#Modal')[0]);
        ko.applyBindings(Model, $('#Modal')[0]);
    });

</script>

模态框内的 html 个元素如下所示：

<input type="checkbox" data-bind="checked:viewModel.check">bla bla..
<button type="button" data-bind="enable:viewModel.check==true" class="btn btn-primary">Delete</button>

当我 select 复选框时 viewModel.check 为真，未选中时为假，这工作正常但按钮始终禁用。有什么建议吗

Answer 1

几个问题...

未实例化的 ViewModel

调用ko.applyBindings时，第一个参数需要是viewModel实例。这意味着您需要在 viewModel "class."

上调用 new

ko.applyBindings(new Model())

HTML

中的范围不正确

您引用的 viewModel 变量不存在。当您应用绑定时，它会使用传入的 viewModel 的范围来创建绑定上下文。这意味着 HTML 中可用的值与 viewModel 中 this 中可用的值相同。所以，只需使用 check.

enable 绑定到表达式，不可观察

启用绑定必须绑定到可观察对象，但您已将其绑定到表达式 check==true。在这种情况下，check 实际上是一个可观察的 — this.check = ko.observable()，因此您最终要比较的是 function() { return true } == true 的效果，预计是 false。要对可观察对象进行比较，您必须首先通过将它们作为函数调用来解包它们：check() == true。但是请注意，无论何时编写 == true，您可能都不需要：enable: check 是您最终想要的。

and a fiddle