template named scopes (repeat="item in items") only work within Polymer Element

[Marcin Warpechowski]

The following syntax:

<template repeat="{{items}}">

works both in Polymer Elements and in the main document body (see how it works: http://jsfiddle.net/warpech/u59pk/2/ )

However, the following syntax ("named scope"):

<template repeat="{{item in items}}">

works only within a Polymer Element template (Polymer Element: http://jsfiddle.net/warpech/u59pk/3/ , body: http://jsfiddle.net/warpech/u59pk/6/ )

I assume this is because the expression "item in items" is only parsed by Polymer Expressions, but it took me some time to investigate.

I have few questions:

1. Is the "item in items" parsing done by https://github.com/Polymer/polymer-expressions/blob/master/third_party/esprima/esprima.js ? I suppose so

2. I there a way to make this expression parse outside of a <polymer-element>? I see a big benefit from using named scopes in my templates but I prefer not to wrap my whole app in a <polymer-element>

3. Template Binding page suggests "item in items" would be available in <template>, also outside <polymer-element> ( http://www.polymer-project.org/platform/template.html ). And I would love it to be so. However, on a page where Polymer Expressions ( http://www.polymer-project.org/platform/template.html ) are described, it is more clear that it only runs within <polymer-element>. Perhaps some clarification should be added there.

Thanks for your great work!

[Marcin Warpechowski]

Sorry, I swapped the links to the "item in items" JSFiddles. Correct links:

body (does not work): http://jsfiddle.net/warpech/u59pk/3/ 

 

Polymer Element (works): http://jsfiddle.net/warpech/u59pk/6/ 

[Rafael Weinstein]

PolymerExpressions is enabling named scopes. This is setup for you automatically within Polymer elements. In the main document, you'll need to set it up yourself. Something like:

http://jsfiddle.net/E63ut/

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 polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/bd390c90-93c0-4ae4-b76e-0a1ee69217d9%40googlegroups.com.

For more options, visit https://groups.google.com/groups/opt_out.

[Jan Miksovsky]

Marcin/Rafeal: This is really cool! I hadn't realized you could take advantage of Polymer bindings outside of a custom element definition, and it opens up some intriguing new possibilities. It'd be nice if HTML designers could learn and use just enough binding syntax in a document's markup to be able to wire together custom elements.

I was wondering if it's currently possible to do this entirely in markup. If all someone's interested in doing is just binding together two properties on two different elements, it'd be nice to be able to specify that an empty object (that is, { } ) should be used as the model without requiring script:

<template id="tmpl" bind model>

  <x-element value="{{foo}}"></x-element>

  <y-element value="{{foo}}"</y-element>

</template>

Is something like this already possible today?

[Marcin Warpechowski]

I agree it is very impressive, thanks Rafael for a very quick response.

@Jan - I don't know a way to do it, but, once again, maybe Rafael can surprise us!