Aman Gupta Aman Gupta - 7 months ago 78
Javascript Question

polymer v 1.0 .. pass values in annotated event handlers

I was wondering how can I pass values to an event handler , when annotating them to an element in a template.

this works:

<button on-click="handleClick">


but this doesn't

<button on-click on-click="handleClick(someValue)">


is there a way?

Answer

It's not totally clear what you are trying to accomplish. So you might want to clarify it a bit. But taking a guess, it sounds like I might still be able to help you...

Look at this Stack Overflow question, the accepted answer and my comment.

Amit points out you could use HTML5 custom (data-) attributes. Like this:

<paper-button id="foo" on-tap="bar" data-args="foo,some other value,2">Click</paper-button>
...
<script>
(function() {
  Polymer({
    is: 'example',
    properties: {...},
    bar: function(e){
      var args = e.target.getAttribute('data-args').split(',');
      // now args = ['foo', 'some other value', '2']
    }
  });
})();
</script>

Which worked for me. However, in my particular use case, I had to use: Polymer.dom(e).path[2].getAttribute('data-args').

To learn more, you can read this reference on Event Retargeting.