2016-07-19 26 views
0

我一直在玩弄使用Knockout的bindingProvider API绑定自定义元素,就像实验一样,看看我是否可以使模板更具可读性。敲除绑定提供程序预处理器与ko:如果绑定

我的处理器一般工作正常,至少对于大多数绑定,但对于绑定,它不起作用。

标记是:

<k-o text="Text" click="clickHandler"></k-o> 

<k-o if="IsShowing"><!-- Doesn't work --> 
    <p> 
    Hello 1! 
    </p> 
</k-o> 

<span data-bind="if: IsShowing"><!-- Works --> 
    <p> 
    Hello 2! 
    </p> 
</span> 

而且代码:

ko.bindingProvider.instance.preprocessNode = function(node) 
{ 
    if (node.nodeName == 'K-O') 
    { 
     var el = document.createElement('span');  
     var att = document.createAttribute('data-bind'); 

     var attvals = []; 

     for(var i = 0; i < node.attributes.length; i++) 
     attvals.push(node.attributes[i].name + ': ' + node.attributes[i].value); 

     att.value = attvals.join(', '); 
     el.setAttributeNode(att); 

     node.parentNode.replaceChild(el, node); 

     return el; 
    } 
} 

演示小提琴:https://jsfiddle.net/whelkaholism/wzqL64ga/

所以文结合,并单击绑定做工精细,不过虽然如果我检查对象检查器和生成的if节点与硬编码的相同,只有硬编码的节点工作。

(这个用例是用于后端数据库访问的应用程序,开发制作功能模板更清晰的自定义元素的任何搜索引擎优化或相关的问题是不相关的。)

回答