1

我有一个 observableArray

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

我需要通过引用所有子标签来传递“项目”属性，因为我必须访问从子标签开始附加的方法，从 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) 不会呈现任何内容，甚至 valueAccessor 处理程序与 foreach 站在一起所有正确的数据。

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

4

1 回答 1

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 正确呈现。

于 2012-05-17T19:31:12.670 回答