Knockout.js - 启用范围绑定答案

【问题标题】：Knockout.js - enable binding for scopeKnockout.js - 启用范围绑定
【发布时间】：2013-07-03 06:21:44
【问题描述】：

我正在寻找通过 knockout.js 启用或禁用范围（块的所有子元素）的最佳方法。理想情况下，它应该如下所示：

<div data-bind="enable:isEnabled()">
    <input type="text" data-bind="value: val1" /><br>
    <input type="text" data-bind="value: val2" />
</div>

此代码现在不起作用 (http://jsfiddle.net/NquQK/)。我该如何实施？是否已经存在用于此任务的现成绑定或插件？

【问题讨论】：

标签： binding knockout.js

【解决方案1】：

一个简单的自定义绑定就可以完成你所需要的：

KO：

ko.bindingHandlers.enableAll = {
    update: function(elem, valueAccessor) {
        var enabled = ko.utils.unwrapObservable(valueAccessor());

        ko.utils.arrayForEach(elem.getElementsByTagName('input'), function(i) {
            i.disabled = !enabled;
        });
    }
};

HTML：

<div data-bind="enableAll: isEnabled()">
    <input type="text" data-bind="value: val1" /><br>
    <input type="text" data-bind="value: val2" />
</div>

http://jsfiddle.net/NquQK/2/

【讨论】：

您想通过在容器元素中绑定enable 来禁用所有子输入吗？
是的。我需要可见元素但已禁用
谢谢，jaux。这个解决方案是有效的。但是有没有办法控制后代绑定？例如跳过已设置启用绑定的可观察对象
毕竟，我决定手动为可观察对象设置启用绑定，jsfiddle.net/LS3qe/1
此答案假定所有控件都已在页面上。如果稍后添加新项目，它们将不会被禁用。示例：jsfiddle.net/NquQK/22