jsonpolymerpolymer-1.0iron-ajax

Iron-ajax can't read json file


I'm using a Polymer app initialized with the Polymer Starter Kit in my first view. I want to read a JSON file inside a <paper-listbox>, and create a <paper-item> for each array element:

Here's the code for my <paper-listbox>:

<paper-listbox>
    <iron-ajax auto url="/listActivities.json" handle-as="json" last-response="{{activities}}" id="ajaxLoader"></iron-ajax>
    <template is="dom-repeat" items="{{activities}}">
        <paper-icon-item>
            <iron-icon icon="star" item-icon></iron-icon>
            <paper-item-body two-line>
              <div><span>{{item.label}}</span></div>
              <div secondary>Unit game number : <span>{{item.unitGames.length}}</span></div>
            </paper-item-body>
        </paper-icon-item>
    </template>
  </paper-listbox>

Here's my JSON file:

[
{
    "_id":"58dbcb30dc0b2a01553c59a9",
    "staticMedia":"58d52d626575de2207193fac",
    "label":"myfirstgame",
    "__v":0,
    "unitGames":["58dbcaa5dc0b2a01553c59a8"]
},
{
    "_id":"58dd1d3edc0b2a01553c59af",
    "staticMedia":"58d12091241b0868bfb29a3b",
    "label":"Jeu à l'IUT",
    "__v":0,
    "unitGames":["58dd1b61dc0b2a01553c59ab"]
},
{
    "_id":"58dd23e14704644b4ab307e6",
    "staticMedia":"58d12091241b0868bfb29a3b",
    "label":"IUT",
    "__v":0,
    "unitGames":["58dd23ba4704644b4ab307e4"]
},
{
    "_id":"58e008d67d08713351f0af13",
    "staticMedia":"58d52d626575de2207193fac",
    "label":"Test POI clue",
    "__v":0,
    "unitGames":["58e008b97d08713351f0af12"]
},
{
    "_id":"58e10d2d7d08713351f0af22",
    "label":"Prunus MLG",
    "__v":0,
    "unitGames":["58e10d167d08713351f0af21"]
}
]

The app doesn't need every part of my JSON file (only needs label and unitGames). When I run the app, it shows nothing after the title of the view. How do I fix this?


Solution

  • The problem came from the url path to my JSON file, the "/" before the name of the file wasn't needed as the file was on the same folder as my-view1.html.