Question

我有一个observableArray

this.Itens = ko.obeservableArray();
this.Itens.toString = function () {return 'my items array'};

我需要传递＆＃39;项目＆＃39;属性通过引用所有子标记，因为我必须从jquery插件开始访问从子节点开始附加的方法：

<div data-bind="customWith: Items ">
    <ul data-bind="foreach:$data"> <!-- function reference of items -->
        <li data-bind="text: ko.toJSON($data)"></li>
    </ul>

    <br>
    <br>

    <!-- Only for debugging -->
    <p data-bind="text: ko.toJSON($data)"></p>
    <p data-bind="text: ko.toJSON($data()[0])"></p>
    <p data-bind="text: $data.fnTest"></p>
    <p data-bind="text: $data.fnTest()"></p>
</div>

这是自定义的ko.bindingHandler：

ko.bindingHandlers.customWith = {

    init: function (element, valueAccessor, allBindingsAcessor, viewModel, bindingContext) {
        ko.bindingHandlers.customWith.update.apply (this, arguments);
        $(element).myplugin ();
        return {'controlsDescendantBindings': true};
    }, 
    update: function (element, valueAccessor, allBindingsAcessor, viewModel, bindingContext) {
        var fnReference valueAccessor = ();
        var childBindingContext = bindingContext.createChildContext (fnReference);
        ko.applyBindingsToDescendants (childBindingContext, element);
    }
};

完整的代码在这里：http://jsfiddle.net/AbraaoAlves/fz5Yj/

正如您在div标签customWith中看到的那样，p正确呈现内容当我从列表中添加或删除项目时更新，但是ul标签（foreach：$ data）甚至没有渲染任何值得访问的处理程序所有正确的数据。

在这种情况下，我该怎么做才能渲染列表中的项目？

Answer 1

您需要将子绑定设置移动到自定义绑定处理程序的init方法。您的处理程序应该如下所示，不需要更新方法：

ko.bindingHandlers.customWith = {

    init:function(element, valueAccessor, allBindingsAcessor, viewModel, bindingContext){

        var fnReference = valueAccessor();           
        var childBindingContext = bindingContext.createChildContext(fnReference);
        ko.applyBindingsToDescendants(childBindingContext, element);

        $(element).myplugin();

        return {'controlsDescendantBindings':true};        
    },
};

这将导致你的LI正确渲染。

knockoutjs：自定义数据绑定'with'以通过引用传递函数

1 个答案: