Hi Roger,
How exactly are you trying to get data into the element? From the comment
about <%= posts %>, it sounds like you're using some kind of template
processing system? Express with EJS maybe?
Is the iron-list element inside another element? Inside a dom-bind
template? Or sitting in the main document? Polymer data binding only works
in the first two places, not in the main document.
>From the error, it appears that the iron-list element is getting an `items`
value set as an *attribute*, not a property. That would be consistent with
putting this in the main document:
<iron-list items="[[posts]]">
Iron-list sees items attribute set to the literal string "[[posts]]". It
tries to parse it as JSON, and sees "[[posts]]" which isn't valid JSON.
Instead, you could do something like this:
<template is="dom-bind">
<iron-list id="list" items="[[posts]]">
<template>
...
</template>
</iron-list>
</template>
<script>
var t = document.querySelector('template[is=dom-bind]');
t.posts = posts;
</script>
Here, you're setting the posts property on the dom-bind. That property is
data bound to the items *property* on the iron-list.
Or if you're really not going to use any other elements, you could go dead
simple.
<iron-list id="list">
...
</iron-list>
<script>
var list = document.getElementById('list');
list.items = posts;
</script>
Here, you're simply imperatively setting the lists items property.
Both of these assume that you have, in posts, a *JavaScript array of
objects*. Not a JSON string. In other words:
posts instanceof Array
=> true
typeof posts[0]
=> "object"
The output in your previous email suggests that you've actually got an
array of _strings_ where each string is a JSON object. That's probably not
what you want, either.
Hope that helps.
Arthur
On Tue, Dec 13, 2016 at 7:18 PM, <[email protected]> wrote:
> Hi Daniel,
>
> Thank you for pointing out the original problem. However, now I can be
> sure that my data type is an array. The typeof posts showing on console
> display as following:
>
> object [ '{"Name":"aaa","Address":"bbb","Phone":"1111"}', '
> {"Name":"ccc","Address":"ddd","Phone":"2222"}', '
> {"Name":"eee","Address":"fff","Phone":"3333"}' ]
>
> This array object still fails when passing into <iron-list> tag. Looking
> at the error handling below where it fails, it has something to do with the
> JSON parser not getting the correct data format assuming 'value' is passed
> with my 'posts' array. But as you can see and confirm above, the 'posts'
> data element format should meet the JSON parse standard unless there is
> something else i overlooked. Thanks.
>
> case Array:
> try {
> value = JSON.parse(value);
> } catch (x) {
> value = null;
> console.warn('Polymer::Attributes: couldn`t decode Array as JSON');
> }
> break;
>
> BR/Roger
>
> Daniel Llewellyn於 2016年12月13日星期二 UTC+8下午10時00分11秒寫道：
>>
>>
>>
>> On Tue, 13 Dec 2016 at 03:49 <[email protected]> wrote:
>>
>>> Hi Daniel,
>>>
>>> And the console log will show my posts data as a type string
>>> representation of my array strings. Thanks.
>>>
>>> string [{"Name":"aaa","Address":"bbb","Phone":"1111"},{"
>>> Name":"ccc","Address":"ddd","Phone":"2222"},{"Name":"eee","
>>> Address":"fff","Phone":"3333"}]
>>>
>>
>> OK, that's your problem. `<iron-list>` takes an array, in the `items`
>> property, not a string. You need to change your `posts` variable to contain
>> an array, or use a different variable which does contain an array.
>>
> 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/dd71a410-1dce-4fca-85ec-e52150623c59%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/dd71a410-1dce-4fca-85ec-e52150623c59%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/CADSbU_wgNvp-y5huAqhiDi9oLf1N5A56953hcn%3DW1xDcnXVPMQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
