fetch data from json file in Polymer - json

Question

I have a json file like below
{
"23": {
"id": 23,
"featured": true,
"name": "Dawid Ostrowski",
"title": "Developer Relations Program Manager",
"company": "Google",
"country": "Switzerland",
"photoUrl": "/images/people/dawid_ostrowski.jpg",
},
"9": {
"id": 9,
"featured": true,
"name": "Mandy Waite",
"title": "Developer Relations Engineer",
"company": "Google",
"country": "UK",
},
"15": {
"id": 15,
"featured": true,
"name": "Jakub Škvára",
"title": "Frontend engineer",
"company": "Shipito",
"country": "Czech Republic",
"photoUrl": "/images/people/jakub_skvara.jpg",
},
"14": {
"id": 14,
"name": "Jana Moudrá",
"title": "Co-Founder",
"company": "Juicymo",
"country": "Czech Republic",
"photoUrl": "/images/people/jana_moudra.jpg"
}
}
I want to get all data of a specific id in Polymer.
like if someone visit example.com/user/23, I want to get the data of 23 so I can display a page using the data.
How do i do it in Polymer?

Answer 1

Assuming you just have one static .json file, and not an API to selectively return JSON strings based on query parameters, you could do the following.
Implement the following method on your Polymer element:
getEntryById: function (id) {
return this.queryResult[id];
}
Use Polymer's iron-ajax element and bind the lastResponse property of this element to queryResult on your new element, and the requestUrl property to the location of your .json file.
Of course, you need some kind of client-side router (like Page.js, included in Polymer Starter Kit) that reads the route and route parameters (the user Id) from the URL and passes it to your Polymer element, so you can appropriately call the getEntryById function.