javascript - Able to get JSON data, but not showing up in Handlebars template -


i have following in page, ready to:

<div id="result"></div> <script id="some-template" type="text/x-handlebars-template">   <table>     <thead>       <th>name</th>     </thead>     <tbody>       {{#athletes}}         <tr>           <td>{{firstname}} {{lastname}}</td>         </tr>       {{/athletes}}     </tbody>   </table> </script> 

and following javascript firing below:

var source   = $("#some-template").html(); var template = handlebars.compile(source);  var data = $.getjson("http://api.espn.com/v1/sports/baseball/mlb/athletes?apikey=axfy7dvwqzktu28srdjna8ta", function() {   alert('load performed.');           });  $("#result").html(template(data)); 

i alert load performed , can see data in firebug, #result div not display data.

if replace var data straight text below functions right:

var data = { athletes: [     {firstname: "josh", lastname: "hamilton"},     {firstname: "yu", lastname: "darvish"},     {firstname: "ian", lastname: "kinsler"}   ] } 

the "athletes" key couple layers down in json tree (sports -> leagues -> athletes). not understanding how extract data api result?

try this:

$.getjson("http://api.espn.com/v1/sports/baseball/mlb/athletes?apikey=axfy7dvwqzktu28srdjna8ta", function(data) {       alert('load performed.');       $("#result").html(template(data.sports[0].leagues[0].athletes));           }); 

also, important sidenote: have pasted apikey. think keep private.


Comments

Popular posts from this blog

c# - SVN Error : "svnadmin: E205000: Too many arguments" -

c# - Copy ObservableCollection to another ObservableCollection -

All overlapping substrings matching a java regex -