使用HBS条带快速查看渲染(消耗?)Handlebars客户端模板
将Don Park的HBS作为视图引擎使用Express,目的是为客户端和服务器代码使用相同的模板样式。 不过,我遇到了一些麻烦。
通过这里显示的index.hbs,
<h1>{{title}}</h1> <p>Welcome to {{title}}</p> <div id="place"></div> <script id="firstTemplate" type="text/x-handlebars-template"> <ul> {{#lines}} <li>{{name}}</li> {{/lines}} </ul> </script>
下面是浏览器呈现的内容:
<h1>Express</h1> <p>Welcome to Express</p> <div id="place"></div> <script id="firstTemplate" type="text/x-handlebars-template"> <ul> </ul> </script>
快速查看渲染过程似乎消耗了预期用于浏览器的模板块。 据我所知,视图渲染器只是将整个文件的.hbs作为一个stringtempate来渲染,而不是将脚本块与服务器视图区分开来。
任何想法/解决方法?
我以同样的方式使用把手,并遇到同样的问题。
我通过存储这部分来解决它:
<script id="firstTemplate" type="text/x-handlebars-template"> <ul> {{#lines}} <li>{{name}}</li> {{/lines}} </ul> </script>
在一个单独的静态文件中,然后在页面渲染后通过ajax加载它。 这样我的客户端模板不会被Express错误地渲染。
如果有一种方法可以添加一个标记让Express知道忽略这样的块并将它们留给客户端,那将会很好。
如果把手与胡须真正兼容,那么这应该工作:
首先把你的分隔符放在你的模板的顶部(在任何模板占位符之前)
{{=<% %>=}}
所以,现在任何你想要服务器渲染的东西,你会做:
<% foo %>
而任何你想在客户端上渲染的东西都是这样的:
{{ bar }}
更多信息在这里的胡子手册的底部 – http://mustache.github.com/mustache.5.html
对于把手,你可以使用反斜杠来逃避双大括号,如下所示:
<script id="firstTemplate" type="text/x-handlebars-template"> <ul> \{{#lines}} <li>\{{name}}</li> \{{/lines}} </ul> </script>