動態設置聚合物定製元素的事件處理程序

我已創建自定義元件（管理員-button.html），其包含以下代碼：動態設置聚合物定製元素的事件處理程序

<polymer-element name="admin-button"> 
    <template> 
    <paper-item class="chip-container" hero-p> 
     <div class="chip" hero-id="addPres" hero> 
     <div class="chip-top" hero-id="addPres-art" hero></div> 
     <div class="chip-bottom" cross-fade> 
      <div class="chip-title-overlay" title="Create presentation"></div> 
      <div class="chip-title">Create presentation</div> 
     </div> 
     </div> 
    </paper-item> 
    </template> 
    <script> 
    Polymer(); 
    </script> 
</polymer-element>

在另一個文件（表body.html），其是本身一個自定義元素，我動態導入此文件，創建該元素的一個實例，並將它附加到菜單列表（＃芯片菜單），像這樣：

<script> 
    var poly = this; 

    Polymer.import(["elements/admin-button.html"], function() { 
    var button = document.createElement("admin-button"); 
    poly.$.chipMenu.appendChild(button); 
    }); 
</script>

沒有問題了這裏。但現在我想給這個新創建的按鈕一個「on-tap」事件處理程序。我想簡單地設置與

button.setAttribute("on-tap", "{{ eventHandler }}");

的屬性，但是這並不工作 - 我懷疑它是與正常在註冊的元素，但我似乎無法就找到如何動態設置事件處理程序的任何提示聚合物文檔中的自定義元素。

如果我硬編碼的元素到HTML這樣

<admin-button on-tap="{{ eventHandler}}"></admin>

與

Polymer.import(["elements/admin-button.html"]);

它的工作原理實例化的元素。但我不想在頁面加載時在HTML代碼中使用自定義元素。

可以這樣做？

來源

2015-04-02 tricon

您使用的是什麼版本的聚合物？我以前從未遇到過Polymer.import，其他人也可能會對此感到疑惑。您可能還想查看addEventListener（...）而不是setAttribute（...） – 2015-04-02 11:07:52

我正在運行0.5.5版本，並且在此獲取有關Polymer.import的提示：https：//www.polymer-project .org/0.5/docs/polymer/helpers.html ... addEventListener正在工作，我似乎無法在父元素中使用預定義的函數，而是必須編寫一個匿名處理函數。 – tricon 2015-04-02 11:34:52

啊，我主要在聚合物飛鏢領域工作。感謝您的鏈接，我很高興現在爲您工作。 – 2015-04-03 11:29:52

嘗試button.addEventListener('tap',eventHandler);。

來源

2015-04-02 11:12:34 idleherb

不是很清楚，但試試這個：

<polymer-element name="admin-button" attributes="eventHandler"> 
 
... 
 
<paper-item class="chip-container" hero-p on-tap="{{ eventHandler}}"> 
 
...

來源

2015-04-02 10:55:59

動態設置聚合物定製元素的事件處理程序

回答

相關問題