Question

是否可以使用Knockout实现“非”绑定？基本上，我想否定绑定值，但保留双向绑定/可观察性。

在我的视图模型中，我有一个属性isVisible，但我的UI要求规定我提供一个复选框来表示隐藏或“不可见”状态。我宁愿不创建重复或第二属性来跟踪否定状态。

这样的代码不能完全运行，因为它没有将observable传递给绑定：

<label>Is Hidden?<input type="checkbox" data-bind="checked: !isVisible()" /></label>

注意：这是一个Q＆amp; A风格的问题 - 虽然我发布了答案，但我对任何不同或改进的答案都非常感兴趣

Answer 1

这是一个“非”绑定，可用于任何单参数“bool”类型的绑定，例如checked，visible，enable等。

使用这样的绑定：

<input type="checkbox" data-bind="not: {checked: isVisible}" />

not绑定：

ko.bindingHandlers.not = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        //expects a single, truthy/falsy binding, 
        //    such as checked, visible, enable, etc.
        var binding = valueAccessor();
        var observable = binding[Object.keys(binding)[0]];
        var notComputed = ko.computed({
            read: function () {
                return !observable();
            },
            write: function (newValue) {
                observable(!newValue);
            }
        });
        var newBinding = {};
        newBinding[Object.keys(binding)[0]] = notComputed;
        ko.applyBindingsToNode(element, newBinding, viewModel);
    }
};

我还没有真正尝试过修饰绑定，但它似乎完全正常。

See the Fiddle

如何使用通用的“非”绑定来否定Knockout中的isVisible绑定？

1 个答案: