node.js – 如何使用MustacheJS忽略标记

我目前通过尝试构建小部件模块来解决MustacheJS模板的问题.

事实上,我使用了两次html模板：

>服务器解析html模板并使用服务器数据进行渲染
>服务器构建的客户端下载页面(已经由服务器端的胡子呈现),我想在ajax请求之后在浏览器中应用第二个Mustache渲染.

但问题是,由于vars在服务器端是空的,模板html不会在客户端呈现…

<!-- Rendered on server side -->
<div class="content noise">
    <h4>{{widget.title}}</h4>
    <p>Issues from {{widget.github.author}}/{{widget.github.repo}}</p>
    <div class="issues"></div>
</div>

<!-- I want to render this only on client side -->
<script type="text/template" id="issueTemplate">
{{#links}}
    <a href="{{url}}" {{#selected}}class="Selected"{{/selected}}>{{{name}}}</a>
{{/links}}
</script>

这里的issueTemplate是空的,因为{{links}}在服务器端是空的.

在客户端,我尝试这样的事情,并将“{{”标记替换为“[[”,但它没有效果：

self.mu = _.clone(Mustache) ;
self.mu.tags = ['[[', ']]'] ;

那么你是否知道如何忽略渲染中的标签,例如’script’？

在Mustache中,您可以使用{{= … =}}标记动态更改标记分隔符;您可以通过选择文字中不存在的分隔符来使用它来创建文字部分.因此你可以做类似的事情

<!-- Rendered on server side -->
<div class="content noise">
  <h4>{{widget.title}}</h4>
  ...
<!-- I want to render this only on client side -->

{{={{{ }}}=}}
<!-- Now only triple braces will be interpreted as tags on the server side -->
<!-- Double braces will be passed through literally -->

<script type="text/template" id="issueTemplate">
{{#links}}
...
{{/links}}
</script>

{{{={{ }}=}}}
<!-- Now double braces delimit tags again if you need to do more server-side rendering-->