如果在同一个html文件中的单独标签中定义了两个模板,如何调用和使用另一个模板?
我知道使用不同的.mustache文件肯定是可行的。
答案 0 :(得分:0)
我相信您正在询问如何使用与模板在同一HTML文件中定义的部分。此示例在两个单独的模板中使用相同的部分来演示。如果您正在寻找另一个例子,请告诉我。
这是两个不同的模板和一个部分
<script type=text id=tpl1>
{{greeting}} {{> planet}}
</script>
<script type=text id=tpl2>
{{planet}}
</script>
<script type=text id=tpl3>
{{> planet}} {{goal}}
</script>
以下是用于查找这些模板,准备数据以及使用重用部分进行渲染的JavaScript。
// get template html
var tpl1 = $('#tpl1').html(),
tpl2 = $('#tpl2').html(), // partial
tpl3 = $('#tpl3').html(),
// define data for each template
tpl1Data = { 'greeting' : 'hello'},
tpl2Data = { 'planet' : 'world'},
tpl3Data = { 'goal' : 'peace'},
// define partial object
partial = {'planet' : tpl2 },
// render to html combining template view and partial view and defining partial
html1 = Mustache.to_html(tpl1, jQuery.extend(tpl1Data, tpl2Data), partial),
html2 = Mustache.to_html(tpl3, jQuery.extend(tpl3Data, tpl2Data), partial);
// write compiled Mustache templates to document
document.write(html1 + ', let\'s try for ' + html2);
你可以see this example in its working entirety on jsFiddle。
如果您想在第二个模板中为部分使用不同的数据,您可以定义tpl2bData = { 'planet' : 'mars' }
之类的内容,并在呈现html2
时引用它。
html2 = Mustache.to_html(tpl3, jQuery.extend(tpl3Data, tpl2bData), partial);