0 
     <div style="display: inline-block" data-bind="autocomplete : { multi:true, values:values}">
     </div>

我有一个自动完成绑定处理程序。现在我想添加一些额外的代码，如果它是多选的话。下面的代码我开始工作，但我希望 bindingHandler 添加它。

 <div class='auto'>    
    <!-- ko foreach : values -->          
        <span data-bind="text: $data"></span>
    <!-- /ko -->     
    <span>       
     <div style="display: inline-block" data-bind="autocomplete : { multi:true, values: values}">
     </div>
    </span>    
</div>

我试图在自动完成 bindingHandler 的 Init 中做这样的事情。但我想绑定没有正确添加。是否可以在 bininghandler 的 init 中添加这样的虚拟绑定？

 $element.wrap("<div class='auto'>");
 $element.wrap("<span>");
 $element.parent().before("<!-- ko foreach : values --><span data-bind='text: $data'></span><!-- /ko -->");

如果我在没有虚拟绑定的情况下这样做，它就可以工作。

$element.wrap("<div class='auto'>");
        $element.wrap("<span>");
        $element.parent().before("<div><span data-bind='text: $data'></span></div>");

        var $div = $element.parent().prev();

        ko.applyBindingsToNode($div[0], function () {
            return {
                foreach: value.values
            };
        });

但我不能用 div 包围它，因为设计不正确。是否可以添加虚拟绑定？

4

1 回答 1

0

如果您坚持在 JavaScript 中设置 HTML（但请不要），您可以使用绑定事物的内部函数。

ko.bindingHandlers.thing = {
    update: function (element, valueAccessor) {
        var html = "The thing is <!-- ko text: thing -->"
                   + "<!-- /ko -->"
        ko.utils.setHtml(element, html);
    }
}

这有潜在的安全问题（我对此一无所知），但似乎可以通过{ 'controlsDescendantBindings': true };从绑定处理程序的 init 处理程序返回来解决。

简单的演示

于 2013-07-30T07:18:46.193 回答