You can ditch the null check on the outside <template> in polymer-list. The
first <template> in an element is what Polymer generates shadow DOM from.
You can also ditch the calls to this.super() since you're not inheriting
from other elements.

Updated demo that works: http://jsbin.com/oqotUdE/1/edit


On Fri, Jan 17, 2014 at 8:25 AM, Junius Gunaratne <[email protected]> wrote:

> I updated to the latest Polymer 0.1.3 and also applied Héctor's advice of
> using an if statement to check for a null object. However, I'm still having
> data binding issues when using a repeat statement. Polymer still doesn't
> seem to like me referring to a JS object as an attribute in a repeat
> statement with a custom element. Am I doing something wrong, or is this a
> bug? If this is a bug are there work arounds in the interim?
>
> This works:
>
> <link rel="import" href="bower_components/polymer/polymer.html">
> <polymer-element name="polymer-list">
>   <template if="{{ items }}">
>     <template repeat="{{ item in items }}">
>       <polymer-custom-elem>{{item}}</polymer-custom-elem>
>     </template>
>   </template>
> <script>
>   (function() {
>     Polymer('polymer-list', {
>       ready: function() {
>         this.super();
>         this.items = [1,2,3];
>       }
>     });
>   })();
> </script>
>  </polymer-element>
>
>
>
> <link rel="import" href="bower_components/polymer/polymer.html">
> <polymer-element name="polymer-custom-elem" attributes="item">
> <template>
>   <content></content>
> </template>
> <script>
>   (function() {
>     Polymer('polymer-custom-elem', {
>       item : '',
>       ready: function() {
>         this.super();
>       },
>     });
>   })();
> </script>
> </polymer-element>
>
>
> Creating an attribute that invokes data binding doesn't work:
>
> <link rel="import" href="bower_components/polymer/polymer.html">
> <polymer-element name="polymer-list">
>   <template if="{{ items }}">
>     <template repeat="{{ item in items }}">
>       <polymer-custom-elem item="{{item}}"></polymer-custom-elem>
>     </template>
>   </template>
>  <script>
>   (function() {
>     Polymer('polymer-list', {
>       ready: function() {
>         this.super();
>         this.items = [1,2,3];
>       }
>     });
>   })();
> </script>
>  </polymer-element>
>
>
> <link rel="import" href="bower_components/polymer/polymer.html">
> <polymer-element name="polymer-custom-elem" attributes="item">
> <template>
>   {{item}}
>   <content></content>
> </template>
> <script>
>   (function() {
>     Polymer('polymer-custom-elem', {
>       item : '',
>       ready: function() {
>         this.super();
>       },
>     });
>   })();
> </script>
> </polymer-element>
>
>
>
> Error:
>
>
>    1. Exception caught during observer callback: TypeError: Cannot read
>    property 'length' of undefined at d.Element.bind (
>    
> http://localhost:8888/bower_components/platform/platform.js:33:8289<http://localhost:8888/bower_components/platform/platform.js>)
>    at d.e [as super] (
>    
> http://localhost:8888/bower_components/polymer/polymer.js:29:19142<http://localhost:8888/bower_components/polymer/polymer.js>)
>    at d.Polymer.ready (
>    
> http://localhost:8888/polymer/elements/polymer-custom-elem/polymer-custom-elem.html/polymer-custom-elem.js:5:19<http://localhost:8888/polymer/elements/polymer-custom-elem/polymer-custom-elem.html/polymer-custom-elem.js>)
>    at d.e.prepareElement (
>    
> http://localhost:8888/bower_components/polymer/polymer.js:29:9780<http://localhost:8888/bower_components/polymer/polymer.js>)
>    at d.i.bind (
>    
> http://localhost:8888/bower_components/polymer/polymer.js:29:8315<http://localhost:8888/bower_components/polymer/polymer.js>)
>    at d.a.(anonymous function) [as bind] (
>    
> http://localhost:8888/bower_components/polymer/polymer.js:29:19197<http://localhost:8888/bower_components/polymer/polymer.js>)
>    at w (
>    
> http://localhost:8888/bower_components/platform/platform.js:33:13704<http://localhost:8888/bower_components/platform/platform.js>)
>    at A (
>    
> http://localhost:8888/bower_components/platform/platform.js:33:14617<http://localhost:8888/bower_components/platform/platform.js>)
>    at d.k.createInstance (
>    
> http://localhost:8888/bower_components/platform/platform.js:33:17581<http://localhost:8888/bower_components/platform/platform.js>)
>    at Object.<anonymous> (
>    
> http://localhost:8888/bower_components/platform/platform.js:33:21750<http://localhost:8888/bower_components/platform/platform.js>
>    ) 
> observe.js:609<http://localhost:8888/bower_components/observe-js/src/observe.js>
>
>
>
>
>
>

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/CACGqRCAPUj%2BJNwLEkP51Bf1edOYHOaA9abfTsfRNGPJKEotELw%40mail.gmail.com.
For more options, visit https://groups.google.com/groups/opt_out.

Reply via email to