knockout.js - 仅当元素具有特定的 css 类时，我可以对元素的宽度进行数据绑定吗？

Question

我想将 Div 元素的宽度数据绑定到 viewModel 的属性，但前提是 Div 具有特定的 css 类。

所以是这样的：

<div data-bind="style: {width : $element.hasClass('dynamicWidth') ? getWidth : ''}">

任何人都知道是否有办法做到这一点？

Answer 1

您可以为此使用自定义绑定。这是一个简单的例子：

ko.bindingHandlers.widthEx = {
    update: function(element, valueAccessor) {
        var options = valueAccessor();
        var property = ko.utils.unwrapObservable(options.property);
        var className = options.class;

        if( $(element).hasClass(className)){
            $(element).width(property);
        }
    }
};

var vm = { width: ko.observable(100)};
ko.applyBindings(vm);

<div data-bind="widthEx: {property: width, class: 'Test'}">

这是工作小提琴：http: //jsfiddle.net/wRyAg/2/