window.addEventListener('polymer-ready', function (e) {
console.log('polymer-ready');
var el = document.createElement('my-element');
el.button.addEventListener('click', function (event) {
console.log('click my-element.button 1');
});
el.$.button2.addEventListener('click', function (event) {
console.log('click my-element.button 2');
});
document.body.appendChild(el);
});
<polymer-element name="my-element" attributes="button">
<template>
<button type="button">Button 1</button>
<button type="button" id="button2">Button 2</button>
</template>
<script>
Polymer('my-element', {
ready: function () {
this.button = this.shadowRoot.querySelector('button');
}
});
</script>
</polymer-element>
...
var el = document.createElement('my-element');
el.button.addEventListener('click', function (event) {
console.log('click my-element.button 1');
});
el.$.button2.addEventListener('click', function (event) {
console.log('click my-element.button 2');
});
document.body.appendChild(el);