Mustache.to_html没有返回任何内容

时间:2014-07-27 10:44:31

标签: html templates getjson mustache

我的页面中总共有(3)个模板,这个叠加模板是第三个也是最后一个。前两个基本上与此模板编写相同,它们工作正常。但是出于某种原因,这个上的console.log(html)什么都不返回:

<!-- JSON -->

{ "art" :   [{
"title" : "2 Intro-B",
"img_small" : "2 Intro-C",
"description" : "8x10 archival print on Epson Fine Art Velvet Paper.",
"price" : "20"}, {  "title" : "6 Bison-B",
"img_small" : "6 Bison-C",
"description" : "8x10 archival print on Epson Fine Art Velvet Paper.",
"price" : "20"}, {  "title" : "7 Cars-B",
"img_small" : "7 Cars-C",
"description" : "8x10 archival print on Epson Fine Art Velvet Paper.",
"price" : "20"}]}


<!-- HTML -->

<div id="overlay"></div>

----------------------------------------------

<!-- SCRIPT -->

<script id="overlayTmpl" type="text/template">

{{#overlayTemplate}}
    <div id="lightbox">
        <div id="closeButton">X</div>
        <img src="/images/{{title}}.jpg"/>
    </div>
{{/overlayTemplate}}

</script>

<script type="text/javascript">
$(function(){

$.getJSON('/scripts/art.json', function(data) {
    var overlaytmpl = $('#overlayTmpl').html();
    var html = Mustache.to_html(overlaytmpl, data);
    console.log(html);
    $('#overlay').html(html);

    });
});
</script>

**在前两个模板中,console.log(html)返回html输出就好了。我不知道为什么这个人挂了什么东西。 JSON文件已经过验证...

请帮助我疯狂。这段代码必须有一个十六进制。谁有魔杖?

1 个答案:

答案 0 :(得分:0)

这可能会对您有所帮助 - 更改您的模板:

<script id="overlayTmpl" type="text/template">
{{#art}}
<div id="lightbox">
    <div id="closeButton">X</div>
    <img src="/images/{{title}}.jpg"/>        
</div>
{{/art}}
</script>