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]<javascript:>
> > 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] <javascript:>.
>> 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.
For more options, visit https://groups.google.com/d/optout.

Reply via email to