如何創建動態聚合物元件\簡單的標籤

我有一個聚合物元素是這樣的：如何創建動態聚合物元件簡單的標籤

<polymer-element name="x-block" attributes="data"> 
    <template> 
     <div class="block-wrapper"> 
      <div class="plus-button"on-click="{{showMdl}}">+</div> 
      <div hidden?="{{!showModal}}" id="modal"> 
       Modal 
      </div> 
      <content select="header"></content> 
     </div> 

    </template> 
    /*Polymer */ 
    <script> 
     Polymer({ 
      ready: function(){ 
       this.showModal = false; 
      }, 
      showMdl: function(e,detail,sender){ 
       this.showModal = true; 
       this.$.modal.style.top = e.layerY+'px'; 
       this.$.modal.style.left = e.layerX+'px'; 
       var newElement = document.createElement('div') 
       newElement.innerHTML = 'dynamicllyElement'; 
       newElement.setAttribute('on-click','{{clickOnDynamicllyElement}}'); 
       this.$.modal.appendChild(newElement); 
      }, 
      clickOnDynamicllyElement:function(){ 
       console.log('1111') 
      } 
     }); 
    </script> 
</polymer-element>

clickOnDynamicllyElement不起作用。

來源

2014-10-28 user3576614

可以使用undoc'd injectBoundHTML（）

例子：

this.injectBoundHTML('<div on-click="{{clickOnDynamicllyElement}}">dynamicllyElement</div>', this.$.modal);

免責聲明 - 這已經由高分子團隊回答了其他地方SO

來源

2014-10-28 19:43:33 sfeast

注意：我的答案可能是矯枉過正。最好只使用 'newElement.addEventListener（'click'，this.clickOnDynamicllyElement.bind（this））;' Scott聚合物小組解釋了這裏（https://groups.google.com/forum） /＃！msg/polymer-dev/I5t73SGLLNc/UlYvEa508pkJ）只有當您確實需要綁定動態HTML數據時，纔會使用injectBoundHTML，而不是僅僅監聽事件。 – sfeast 2014-10-29 20:30:47

從聚合物文檔

https://www.polymer-project.org/docs/polymer/polymer.html#imperativeregister

註冊勢在必行元素可以在純JavaScript中註冊這樣的：

<script> 
    Polymer('name-tag', {nameColor: 'red'}); 
    var el = document.createElement('div'); 
    el.innerHTML = '\ 
    <polymer-element name="name-tag" attributes="name">\ 
    <template>\ 
     Hello <span style="color:{{nameColor}}">{{name}}</span>\ 
    </template>\ 
    </polymer-element>'; 
    // The custom elements polyfill can't see the <polymer-element> 
    // unless you put it in the DOM. 
    document.body.appendChild(el); 
    </script>

您需要添加到文檔中，以便自定義元素填充工具撿起來。

重要提示：由於此處的Polymer調用不在此處，它必須包含標記名稱參數。

來源

2014-10-29 03:10:03 sesteva

如何創建動態聚合物元件\簡單的標籤

回答

相關問題