CODEWITHSUNDEEP
polymer
jimi dough10
jimi dough10

Reputation: 2016

error displaying core-ajax custom element

i am making a custom element to display a wall of album covers from a subsonic server. when declared the element will query the server and get back 200 response. the response logs in the console correctly. but nothing is rendered in the browser. 

<link rel="import" href="../bower_components/core-ajax/core-ajax.html">
<link rel="import" href="album-info-big-art.html">
<polymer-element name="albums-wall" attributes="url">
<template>
 <core-ajax auto url="{{url}}" handleAs="json" response="{{response}}"></core-ajax>
  <template id='albums' repeat="{{response.subsonic-response.albumList2.album}}">
   <album-info-big-art artist='{{artist}}' title='{{name}}' img='{{coverArt}}'></album-info-big-art>
  </template>
 </template>
 <script>
  Polymer('albums-wall',{
   responseChanged: function(e) {
     var albums = this.response;
     console.log(albums);
   }
 });   
</script>
</polymer-element>

the response looks like.

Object {subsonic-response: Object}
 subsonic-response: Object
  albumList2: Object
   album: Array[60]
__proto__: Object
status: "ok"
version: "1.10.2"
xmlns: "http://subsonic.org/restapi"
__proto__: Object
__proto__: Object

i am pretty sure i have missed something in the js section.

Upvotes: 0

Views: 229

Answers (1)

Dirk Grappendorf
Dirk Grappendorf

Reputation: 3422

The problem is the property name subsonic-response. You cannot use a dash in a path property name. Rewrite your expression to use array syntax: response['subsonic-response']....

Upvotes: 2

Related Questions