Hi Scott,
Thanks for the reply, another small question if I may,
I can't find anywhere how to create an IF statement in the Polymer
templating system, I would like to do something like:
{{if line.disruptions}}
<ul class"line-disruptions">....</ul>
{{endif}}
How is that done?
Thanks!
On Friday, 14 March 2014 05:47:16 UTC, Scott Miles wrote:
>
> Thanks for the follow up question. That model-from-event expression is
> critical information that we (engineering) haven't communicated properly.
>
>
> On Thu, Mar 13, 2014 at 10:38 PM, Michael Bleigh
> <[email protected]<javascript:>
> > wrote:
>
>> Good to know! Thanks.
>>
>>
>> On Thu, Mar 13, 2014 at 10:17 PM, Scott Miles <[email protected]<javascript:>
>> > wrote:
>>
>>> 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]<javascript:>
>>> > 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] <javascript:>.
>>>> 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/abd7d392-38c2-4fc3-92c3-a3a5555bbb03%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
