3

我正在尝试使用 knockoutjs 自定义绑定来创建组件。这可能不是一个好主意,如果有其他方法可以做同样的事情,我愿意接受其他选择。

这个想法是为元素设置自定义绑定,以便根据传递给绑定的数据填充元素内容。

例如(在玉模板中),我会写:

div(data-bind="keyValueEditor: $data.somePropertyHoldingSomeData")

我有以下(为问题简化)自定义绑定:

ko.bindingHandlers.keyValueEditor = {
    init: function ( element, valueAccessor ) {
        var value = valueAccessor();

        var valueUnwrapped = ko.unwrap( value );

        $( "<span data-bind='text: theDataThatWasPassedToTheBinding.value'/>" ).appendTo( element );
        }
    },
    update: function ( element, valueAccessor ) {
    }
};

value是一个我想使用绑定绑定到跨度内容的可观察对象text。我的问题是我不知道要放入什么,theDataThatWasPassedToTheBinding所以它等于$data.somePropertyHoldingSomeData作为绑定的值传递。

我试过了:

$( "<span data-bind='text: " + valueAccessor().value + "'/>" ).appendTo( element );

$( "<span data-bind='text: " + ko.unwrap( valueAccessor() ).value + "'/>" ).appendTo( element );

这可能吗?

4

1 回答 1

1

你可以使用函数
ko.applyBindingsToNode(node, bindings, viewModel, bindingAttributeName)

ko.bindingHandlers.keyValueEditor = {
    init: function ( element, valueAccessor ) 
    {
        var somePropertyHoldingSomeData = valueAccessor();
        var span = $( "<span>" );
        span.appendTo(element);
        ko.applyBindingsToNode(span[0], {text: somePropertyHoldingSomeData.value})
    }
}  

JSFiddle 演示

于 2013-10-27T15:05:19.430 回答