Search code examples
javascriptpolymerweb-component

Attach event handler to Polymer core element


I'm doing my first steps with Polymer. The documentation is quite nice about which elements are available, but I'm missing some infos about event handling. I have the following example:

<core-header-panel flex>                                  
  <core-toolbar>
    <core-icon-button icon='menu' on-click='my_handler'></core-icon-button>
  </core-toolbar>
</core-header-panel>

My test handler is defined like this:

var my_handler = function() {
  alert('!!!');
};

Looking at the documentation, I don't see any specification of available events. Where do I find them? I tried on-click and on-tap without success. I consider this as some kind of "Hello World!" example, so I must be missing something. Can somebody explain how to tell the button to call my handler if it's clicked?


Solution

  • In Polymer >= 1.0 curly braces aren't necessary for event handlers anymore.

    Old answer

    In Polymer you need the moustache in each binding

     on-click='{{my_handler}}'
    

    You can find a complete example in this question bind a polymer template to html5 video.textTracks