First off, I gave the example on the wrong element, I believe this is more
accurately what was asked for:
<ul class="line-disruptions" on-tap="{{tapHandler}}">
>> would it be possible to make tapHandler aware of the specific disruption
instance
Yes. The handler can do:
tapHandler: function(event) {
// get the specific `line` object associated with the target element
var line = event.target.templateInstance.model;
// do stuff with `line`
...
}
Scott
P.S. This expression `event.target.templateInstance.model` is so handy that
we plan on sugaring it in the near future, maybe by promoting the `model`
property to the `event` object, or possibly as another argument to the
handler.
On Thu, Mar 13, 2014 at 9:32 PM, Michael Bleigh <[email protected]> wrote:
> This isn't 100% related, but in the event of a declarative event in a
> repeat, is there any way to pass non-rendered data through to the event
> handler? For instance, in the example given, would it be possible to make
> tapHandler aware of the specific disruption instance short of passing some
> kind of index reference via data attributes etc.
>
> On Thursday, March 13, 2014 2:18:38 PM UTC-7, Scott Miles wrote:
>
>> The easiest way is to use Polymer's declarative event sugaring:
>>
>> <li class="line-disruption {{disruption.class}}"
>> *on-tap="{{tapHandler}}"*>{{disruption.from}} to {{disruption.to}}:
>> {{disruption.status}}</li>
>>
>> See here for documentation: http://www.polymer-project.
>> org/docs/polymer/polymer.html#declarative-event-mapping
>>
>> >> this.shadowRoot.querySelectorAll('ul.line-disruptions')
>>
>> This should work, as long as those elements exist at the time you perform
>> the query. IOW, only after the template has stamped actual 'ul' elements
>> will you be able to query for them.
>>
>>
>> On Thu, Mar 13, 2014 at 4:14 AM, Martí Planellas <[email protected]>wrote:
>>
>>> Hi all, I've been fighting this for a while, I have this html in my
>>> polymer element:
>>>
>>> <div class="container">
>>> <ul class="lines">
>>> <template id="line" repeat="{{line in lines}}">
>>> <li class="line {{line.class}}">
>>> <div class="line-label">
>>> <span class="line-name {{line.nameclass}}">
>>> {{line.name}}
>>> </span>
>>> <span class="line-status {{line.class}}">
>>> {{line.status}}
>>> </span>
>>> </div>
>>> <ul class="line-disruptions">
>>> <template id="disruption" repeat="{{disruption
>>> in line.disruptions}}">
>>> <li class="line-disruption
>>> {{disruption.class}}">{{disruption.from}} to {{disruption.to}}:
>>> {{disruption.status}}</li>
>>> </template>
>>> </ul>
>>> </li>
>>> </template>
>>> </ul>
>>> </div>
>>>
>>> So there're two nested templates, now I want to add some click event on
>>> the *ul.line-disruptions* elements, but I have no idea how to get to
>>> these elements...
>>>
>>> I tried this.shadowRoot.querySelectorAll('ul.line-disruptions') but
>>> nothing is returned.
>>>
>>> How do I access those nodes?
>>>
>>> Thanks.
>>>
>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>>> ---
>>> You received this message because you are subscribed to the Google
>>> Groups "Polymer" group.
>>> To unsubscribe from this group and stop receiving emails from it, send
>>> an email to [email protected].
>>>
>>> To view this discussion on the web visit https://groups.google.com/d/
>>> msgid/polymer-dev/76621c93-187f-4810-a3ef-026c080b4383%
>>> 40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/76621c93-187f-4810-a3ef-026c080b4383%40googlegroups.com?utm_medium=email&utm_source=footer>
>>> .
>>> For more options, visit https://groups.google.com/d/optout.
>>>
>>
>> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/6edef541-f33d-44f7-b976-d2d1f1379806%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/6edef541-f33d-44f7-b976-d2d1f1379806%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
>
> For more options, visit https://groups.google.com/d/optout.
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/CAHbmOLbxVhSLqpwS6jcR3vKQQnKrAnL78OQvzMS3yOazU96yPw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
