Question

我不能为我的生活弄清楚我做错了什么。

这是我的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":" "
}

我得到的唯一输出是＆＃34;：＆＃34;所以它正确地做了一些事情。没有显示任何内容（因为完全没空，所以我假设在任何地方都没有语法错误？）。

我不喜欢发布这样的问题，因为我的某些地方出现了一些小错误，但我知道你们喜欢这些东西;）

Answer 1

由于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));
        });            
    });

Answer 2

getJSON是异步的，所以

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

也应该都在回调内部

把手没有解析？

2 个答案: