只有当元素具有特定的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/