2013-12-03 4 views
0

Я не могу для жизни меня выяснить, что я делаю неправильно.Ручки не разбираются?

Это мой HTML/JS:

<html> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> 
    <script src="handlebars-v1.1.2.js"></script> 
    <script> 
     $(document).ready(function(){ 
      var jsonString = null; 
      $.getJSON("data.json", function(data) { 
       jsonString = data; 
      }); 
      var source = $("#items").html(); 
      var template = Handlebars.compile(source); 
      $("ul").append(template(jsonString)); 
     }); 
    </script> 
</head> 
<body> 
    <script id="items" type="text/x-handlebars-template"> 
     <span>{{Title}} : {{CSCI}}</span> 
    </script> 
    <ul> 
    </ul> 
</body> 
</html> 

И это мой data.json файл:

{ 
"Title":"I am a thing", 
"CSCI":" " 
} 

Единственный выход я получаю это ":" так, что он делает что-то правильно. Консоль ничего не показывает (как в полностью пустой, поэтому я предполагаю, что в ней нет синтаксических ошибок?).

Я не хотел публиковать вопросы, как это, как это обычно из-за небольшой ошибки с моей стороны куда-то, но я знаю, что вы, ребята любят этот материал;)

ответ

2

Как getJSON является функцией асинхронной позвонить вам нужно компилировать Handlebars в функции обратного вызова успеха

$(document).ready(function(){ 
     var jsonString = null; 
     $.getJSON("data.json", function(data) { 
      jsonString = data; 
      var source = $("#items").html(); 
      var template = Handlebars.compile(source); 
      $("ul").append(template(jsonString)); 
     });    
    }); 
1

getJSON является асинхронной, и так

var source = $("#items").html(); 
var template = Handlebars.compile(source); 
$("ul").append(template(jsonString)); 

все должны быть внутри O f обратный вызов также

Смежные вопросы