如何在HTML中定义胡须部分? [英] How to define mustache partials in HTML?

查看:105
本文介绍了如何在HTML中定义胡须部分?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我的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 的文件中,那么我可以将它包含为部分

我可以在单个html文件中定义它们吗?

as you can see, I want to reuse the #li-templ part, but it seems that I have to write it into a file called li-templ.mustache then I can include it as partial?
can I just define them in the single html file?

推荐答案

我假设你使用了胡须的JS风味。

I'm assuming you're using the JS flavor of Mustache.


在mustache.js中,部分对象可以作为Mustache.render的第三个参数传递。该对象应该以部分名称为关键字,其值应为部分文本。

In mustache.js an object of partials may be passed as the third argument to Mustache.render. The object should be keyed by the name of the partial, and its value should be the partial text.

您需要:


  1. 为名称定义一些虚拟数据
  2. 通过获取#li-templ的HTML来获取部分模板

  3. 创建一个名为partial(li-templ)的对象作为键

  4. 告诉Mustache使用视图数据呈现每个模板,包括您的部分

这里有一些jQuery可以做到这一点:

Here's some jQuery to do just that:

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/

Here's a jsFiddle of it all working- http://jsfiddle.net/maxbeatty/EYDfP/

这篇关于如何在HTML中定义胡须部分?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆