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