Question

这是我的HTML：

<script type="text/html" id="ul-template">
    <ul id="list">
        {{> li-templ}}
    </ul>
</script>  

<script type="text/html" id="ul-template2">
    <div id="list2">
        {{> li-templ}}
    </div>
</script>    

<script type="text/html" id="li-templ">
    <p>{{ name }}</p>
</script>

正如您所看到的，我想重用#li-templ部分，但似乎我必须将其写入名为li-templ.mustache的文件中，然后我可以将其包含为partial？
我可以在单个html文件中定义它们吗？

Answer 1

我假设你正在使用Mustache的JS风格。

在mustache.js中，partials的对象可以作为第三个参数传递给Mustache.render。该对象应使用partial的名称键入，其值应为部分文本。

你需要：

为名称
通过获取＃li-templ
创建一个名为partial（li-templ）作为键的对象
告诉Mustache使用包含部分

以下是一些jQuery：

var view = {"name" : "You"},
li = $('#li-templ').html(), 
partials = {"li-templ": li},
ul1 = Mustache.to_html($('#ul-template').html(), view, partials),
ul2 = Mustache.to_html($('#ul-template2').html(), view, partials);;

document.write(ul1, ul2);

这是所有工作的jsFiddle- http://jsfiddle.net/maxbeatty/EYDfP/

Answer 2

ICanHaz.js（ICH）可以为您提供帮助。

ICanHaz.js：使用Mustache.js进行客户端模板化的一种简单/强大的方法。

我发现混合模板（在脚本标签中）与页面中的普通HTML混淆了我的代码编辑器（语法高亮，缩进等）。将它们作为单独的服务器加载可以保持HTML清洁。

每个文件检出this ICH pull request for automatic loading of <script type="text/html" src="my-templates.html"></script> from your server一个模板。

你也可以load more than one template per remote HTML file this使用简单的代码，如：

function getTemplates(url) {
    $.get(url, function (response) {
        $('template', response).each(function () {
           ich.addTemplate(this.id, $(this).text());
        });
    });
}

或者，如果您希望ICH从页面中的网址自动加载它们：

<head>
    <link rel="templates" type="text/html" href="my-templates.html">
</head>

$("link[type=templates]").each(function (index, link) {
    getTemplates(link.attr("href"));
});

在my-templates.html

中

<templates>
    <template id="ul-template">
        <ul id="list">
            {{> li-templ}}
        </ul>
    </template>  

    <template id="ul-template2">
        <div id="list2">
            {{> li-templ}}
        </div>
    </template>    

    <template id="li-templ">
        <p>{{ name }}</p>
    </template> 
</templates>

如何在HTML中定义胡子部分？

2 个答案: