javascript - 使用 Mustache.js 从 JSON 响应中呈现值列表

Question

我正在使用 Mustache.js 来格式化来自 jQuery getJSON() 请求的响应。 getJSON 请求获取图像名称列表。我想在调用时在我现有内容的末尾显示一系列这些图像。

返回的 JSON 如下所示:

[
  {"id":{"_time":1351063373,"_machine":56912161,"_inc":1690583039,"_new":false},"url":"5.jpg","tags":[]},
  {"id":{"_time":1351063237,"_machine":56912161,"_inc":1690583038,"_new":false},"url":"Repinzle-Logo.png", "tags":[]},
  {"id":{"_time":1351063186,"_machine":56912161,"_inc":1690583037,"_new":false},"url":"21.jpg","tags":[]}}
]

我正在用每个函数解析它......我的 AJAX 请求(jQuery 看起来像这样):

<script type="text/javascript">
    var imageNum=20;
    var imageCount=0;

    function getMoreImages(){
        imageCount=imageCount+imageNum;
        $.getJSON("/getImages", { start: imageNum, count: imageCount },
            function(data){
            $.each(data, function(key, val) {
                // do stuff with val.url

                var url = val.url;
                var template = $('#item-tpl').html();
                var newitem = Mustache.to_html(template, url);
                    $('#main').append(newitem);
                });     
              });
    }
</script>

这是 mustache.js 模板

<script id="item-tpl" type="text/html">
    <div><img src="https://myurlstem.com/mydir/{{url}}" class="item"></div>
</script>

据我所知，我已经正确设置了所有内容，但由于某些原因，url 没有正确发送到模板。

Answer 1

您需要将对象传递给 to_html 方法。

var newitem = Mustache.to_html(template, { url: url });

通常，我认为您会通过整个模型或系列。