如何通過引用元素之外的模板來綁定模板

我正在嘗試在我創建的聚合物元素中注入標籤。有了這個，我打算能夠控制元素中的區域（在我的情況下，我的目標是能夠傳入模板，然後在模型中爲每個元素加蓋模板）。如何通過引用元素之外的模板來綁定模板

所以我準備的，我想怎麼做一個小例子：

http://jsbin.com/wofokanafidu/1/edit

這工作我需要的方式。但是，如果我堅持標籤成聚合物元素本身這個停止工作：

http://jsbin.com/votihiqozusa/1/edit

我怎樣才能實現第一個例子在第二種情況下的效果？

問候和感謝很多提前，

來源

2014-08-30 Ablu

http://jsbin.com/wukaloqacedo/1/這類作品，但它再次顯示my-test元素的輸出。 – user1259201 2014-08-31 00:06:45

我現在找到了一種簡單的情況下做到這一點：

http://jsbin.com/xexusuhovuka/1/edit

這使得利用<content>插入點。所以我只需要爲模板設置模型。

雖然這工作得很好這不幸的是沒有幫助我在我的計劃使用情況，因爲我不想重複一個<table>元素那裏，像裏面的模板：

<table> 
    <table> 
     <th>Heading1</th> 
     <content></content> 
    </table> 
</table>

如果<content>不起作用應該包含例如<tr>標籤。

因此，我會繼續嘗試找到一種方法，允許將shadowroot中的<template>綁定到<template>之外。但我仍然在回答這個問題，因爲它可能是更簡單情況的替代方案。

來源

2014-08-31 09:31:37 Ablu

http://jsbin.com/zadejogide/1/edit?html,output

這把小提琴的作品。這並不直接回答你的問題，但它解釋了會發生什麼。

如果將「my-element」嵌套到antoher元素中，則該元素的Light DOM隱藏在外部元素的陰影樹中（在本例中爲「my-test」），這意味着：模板標記找不到它。

可能的解決方案

，你可以採用模板，並將其添加到「我的元素」的shadowRoot（在某種程度上模板承認其參與了shadowRoot但沒有其他人）喜歡這裏Using template defined in light dom inside a Polymer element（動態模板創建）

或者用is =「auto-binding」嘗試這個。

<polymer-element name="my-element"> 
    <template> 
     <template id="template" is="auto-binding" ref="foo"> 
      should not get displayed 
     </template> 
    </template> 
    <script> 
     Polymer('my-element', { 
      domReady: function() { 
      var foo = this.querySelector('#foo'); 

      if(foo){ 
       this.shadowRoot.appendChild(foo); 
      } 
      } 
     }); 
    </script> 
</polymer-element>

這兩種方法不「真」回答你的問題，但他們對這種情況可以接受workarouns。

我也嘗試在javascript中設置模板的ref_屬性，但沒有成功......並且對私有成員進行戳動並不是一個很好的做法。

來源

2014-12-21 17:34:20 Tobi

如何通過引用元素之外的模板來綁定模板

回答

相關問題