Hi Robert,
thx for your reply. I want to use Polymer 1.0 and changed the
datat-provider. Unfortunately I can't get it to work.
data-provider looks this way right now:
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-ajax/iron-ajax.html">
<dom-module id="data-provider" is="dom-bind">
<template>
<iron-ajax
auto
url="application-states.json"
last-response="{{statesLoaded}}"
handle-as="json"
verbose="true">
</iron-ajax>
</template>
<script>
Polymer({
is: 'data-provider',
properties: {
states: {
type: Array,
value: function() { return []; }
}
},
statesLoaded: function() {
// Make a copy of the loaded data
this.states = this.$.ajax.response.slice(0);
console.log('states loaded ' + this.ajaxResponse);
}
});
</script>
</dom-module>
and the template like this
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../application-state/application-state.html">
<link rel="import" href="data-provider.html">
<dom-module id="application-states">
<template>
<data-provider id="provider" states="{{states}}"></data-provider>
<template is="dom-repeat" items="{{states}}">
<template is="dom-repeat" items="{{item.address}}">
<application-state name="{{item.address}}"
value="{{item.value}}"
generation="{{item.generation}}"
version="{{item.version}}">
</application-state>
</template>
</template>
</template>
<script>
Polymer({
is: 'application-states'
});
</script>
</dom-module>
So at the moment there are no more JS errors, but the preview stays empty.
So I guess the data-binding between provider and template doesn't work.
I don't know why.
Could someone have a look?
Thanks
Am Dienstag, 9. Juni 2015 16:35:17 UTC+2 schrieb Robert Simon:
>
> Hi Thomas,
>
> first decide if you are writing old polymer element with polymer-element
> as you are using in "data-provider", or new 1.0 with dom-module and keep
> them version compatible.
> Than mby debugging will be easier.
>
> And yes, immutable data is good practice.
>
> Regards
> Robert
>
> On Tuesday, June 9, 2015 at 3:03:48 PM UTC+2, Thomas Kuchs wrote:
>>
>> Hi,
>>
>> I try to get sample data from a JSON file to fill my template with
>> repeatable elements based on the original tutorial (with post-service) and
>> the new sample on the 1.0 homepage (friend-list).
>> My JSON looks like that:
>>
>> [
>> {
>> "address": {
>> "Value": "ip:port",
>> "Generation": xyz,
>> "Version": 123
>> },
>> "alive": {
>> "Value": "false",
>> "Generation": xyz,
>> "Version": 123
>> },
>> "name": {
>> "Value": "foo",
>> "Generation": xyz,
>> "Version": 123
>> },
>> "version": {
>> "Value": "2015.06.01.009",
>> "Generation": xyz,
>> "Version": 123
>> }
>> }
>> ]
>>
>>
>> Now I tried to create a data-provider (like post-service from first
>> tutorial) in the following way
>>
>> <link rel="import" href="../polymer/polymer.html">
>> <link rel="import" href="../iron-ajax/iron-ajax.html">
>> <polymer-element name="data-provider" attributes="states">
>> <iron-ajax
>> auto
>> url="application-states.json"
>> last-response="{{statesLoaded}}"
>> handleAs="json"
>> debounce-duration="300"
>> verbose="true">
>> </iron-ajax>
>> </template>
>> <script>
>> Polymer('data-provider', {
>> created: function() {
>> this.states = [];
>> },
>> statesLoaded: function() {
>> // Make a copy of the loaded data
>> this.states = this.$.ajax.response.slice(0);
>> },
>> });
>> </script>
>>
>>
>> and my custom element which uses the provider
>>
>> <link rel="import" href="../polymer/polymer.html">
>> <link rel="import" href="data-provider.html">
>>
>> <dom-module id="application-states">
>> <template>
>> <template is="dom-repeat" items="{{states}}">
>> <application-state name="{{item.address}}"
>> value="{{item.value}}"
>> generation="{{item.generation}}"
>> version="{{item.version}}">
>> </application-state>
>> </template>
>> </template>
>>
>>
>> Unfortunately I get the following JS error, when previewing the element
>> with polyserve.
>>
>> mutating the [[Prototype]] of an object will cause your code to run very
>> slowly; instead create the object with the correct initial [[Prototype]]
>> TypeError: prototype.registerCallback is not a function
>>
>> Any suggestions?
>>
>> Thx in advance
>>
>> Am Sonntag, 10. Mai 2015 22:51:51 UTC+2 schrieb Thad Humphries:
>>>
>>> I can use iron-ajax with Polymer 0.9.0-rc1 to retrieve a JSON object and
>>> display a value in the template like so:
>>>
>>> <dom-module id="my-element">
>>> <template>
>>> <iron-ajax url="
>>> http://api.openweathermap.org/data/2.5/weather?type=accurate&units=imperial&cnt=1&q=Charlottesville
>>> "
>>>
>>> auto last-response="{{resp}}"></iron-ajax>
>>>
>>> <textarea value="{{resp.main.temp}}"></textarea>
>>> </template>
>>> </dom-module>
>>>
>>> <script>
>>> Polymer({
>>> is: 'my-element',
>>> properties: {
>>> resp: {
>>> type: Object
>>> }
>>> }
>>> });
>>> </script>
>>>
>>>
>>> This also works with a simple JSON object retrieved from a public HTML
>>> directory on my localhost. However I try to access an object in an array,
>>> I'm told the object is undefined. For example, if the JSON array contains
>>> two objects called "queries", <textarea
>>> value="{{resp.queries}}"></textarea> displays "[object Object],[object
>>> Object]". However if I attempt, <textarea
>>> value="{{resp.queries[0]}}"></textarea> or <textarea
>>> value="{{resp.queries[0].title}}"></textarea>, the displayed value is "
>>> undefined".
>>>
>>> Am I doing something wrong? Is this a known shortcoming? Is there a work
>>> around?
>>>
>>
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/88cb16d1-1464-4fc3-ad34-fa208e96486a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
