我该如何强迫玉佩胡子?

这是我的玉雕像:

section#entry-review-template.template(data-class='entry-review') table thead tr th='Date' th='Title' th tbody 

当我开始给它添加一个小胡子的时候,我觉得它开始失去了平常的恩典,因为现在她对脸上的毛孔都非常挑剔。

  {{^entries}} h1='No Posts' div='There are no blog posts to review.' {{/entries}} 

然而,这次我试着把最后一片小胡子加到她身上时,她开始抱怨,她要么分手,不想帮忙,要么弄得一团糟

 {{#entries}} tr td='{{date}}' td='{{title}}' td a.remove-entry {{/entries}} 

导致这样的事情:

 {{^entries}} <h1>No Posts</h1><div>There are no blog posts to review.</div>{{/entries}} {{#entries}} <table><thead><tr><th>Date</th><th>Title</th><th></th></tr></thead><tbody></tbody></table>{{date}}{{title}}<a class="remove-entry"></a>{{/entries}} 

我似乎无法让玉器正确输出我的胡须纯文本。

这是一个node.js应用程序,它使用jade在服务器端对我的视图进行模板化,我没有将任何模型传递给我的任何视图(我留给客户端的那种沉重的举动),但是我仍然需要做的一堆inclue partial到处。 我有很多玉器 我有种爱玉。 我不想放开她。

现在我想在客户端实现非常简单的小胡子模板,并且我希望这些在我的视图中是内联的。

当然,我可以解决它,并在脚本标记或使用另一个视图引擎(现在我想,它甚至不觉得一个简单或简单的事情),但我会为那些编写原始的html,我有点想混合两全其美。

  • 即使尝试,我了吗?
  • 我怎么能告诉这只是一个游戏,让她忽略我的{{#must}} {{/ache}}
  • 可以被告知以某种方式忽略空白?
  • 你认为我应该考虑哪些其他的select?

我真的想让玉戴胡子。 我知道它很奇怪,但它会打开我。

更新:

我只是尝试使用| , logging在这里 ,但即使是最简单的:

 section#entry-review-template.template(data-class='entry-review') table thead tr th='Date' th='Title' th tbody | {{#entries}} | {{/entries}} 

结束输出:

 {{#entries}} {{/entries}} <table><thead><tr><th>Date</th><th>Title</th><th></th></tr></thead><tbody></tbody></table><h1></h1> 

我们来定义一些Jade mixin。

 mixin if(name) != '{{#' + name + '}}' block != '{{/' + name + '}}' mixin unless(name) != '{{^' + name + '}}' block != '{{/' + name + '}}' mixin each(name) != '{{#' + name + '}}' block != '{{/' + name + '}}' 

在您的Jade模板中stream利使用它们:

 section#entry-review-template.template(data-class='entry-review') +unless('entries') h1='No Posts' div='There are no blog posts to review.' table thead tr th='Date' th='Title' th tbody +each('entries') tr td='{{date}}' td='{{title}}' td a.remove-entry 

一个美丽的小胡子-HTML被生成。

 <section id="entry-review-template" data-class="entry-review" class="template">{{^entries}} <h1>No Posts</h1> <div>There are no blog posts to review.</div>{{/entries}} <table> <thead> <tr> <th>Date</th> <th>Title</th> <th></th> </tr> </thead> <tbody>{{#entries}} <tr> <td>{{date}}</td> <td>{{title}}</td> <td><a class="remove-entry"></a></td> </tr>{{/entries}} </tbody> </table> </section> 

好的,所以这可能是太迟了,没有任何用处,而且已经有了一个可以接受的答案(在那里,我不太明白什么“可以删除评论”的意思)。 不过,我认为这对今后的工作可能是有用的,所以这里是我迄今为止发现的。

从上面的代码中拿出了一小段代码,并将它们放入一个使用相同的简单“文本输出”语法的例子中,这个语法显然给了你一个奇怪的混乱输出:

 section#entry-review-template.template(data-class='entry-review') table thead tr th Date th Title th tbody | {{#entries}} tr td {{date}} td {{title}} td a.remove-entry | {{/entries}} 

把它放在Jade直播网站( http://naltatis.github.com/jade-syntax-docs )的编辑框中,并从Jade得到输出:

 <section id="entry-review-template" data-class="entry-review" class="template"> <table> <thead> <tr> <th>Date</th> <th>Title</th> <th></th> </tr> </thead> <tbody>{{#entries}} <tr> <td>{{date}}</td> <td>{{title}}</td> <td><a class="remove-entry"></a></td> </tr>{{/entries}} </tbody> </table> </section> 

然后在TryHandlebars网站( http://tryhandlebarsjs.com )用以下数据进行了尝试:

 { "entries" : [ { "date" : "Jan 2, 2010", title: "ABCDEF" }, { "date" : "Nov 15, 2012", title: "UVWXYZ" } ] } 

并用以下输出正确执行:

 <section id="entry-review-template" data-class="entry-review" class="template"> <table> <thead> <tr> <th>Date</th> <th>Title</th> <th></th> </tr> </thead> <tbody> <tr> <td>Jan 2, 2010</td> <td>ABCDEF</td> <td><a class="remove-entry"></a></td> </tr> <tr> <td>Nov 15, 2012</td> <td>UVWXYZ</td> <td><a class="remove-entry"></a></td> </tr> </tbody> </table> </section> 

我不知道自己是不是在做与自己尝试的东西不同的东西,但看起来(至less表面上)是可以从Jade模板手动生成Mustache / Handlebars模板而不会产生冲突。 与更复杂的模板可能会有一些冲突,但我还没有find任何。

我自己一直在玩弄这个想法已经有一段时间了,而且一直在做一些挖掘。 然而,我的主要驱动力是,我真的喜欢简单的“无逻辑”的胡须/把手的逻辑构造和Haml / Jade的美丽的冗长度减less,我想要一个组合。 为此,似乎更好的select可能是Hamlbars或更好的EmblemJS,我正在试验。

解决scheme:玉的HTML评论

  // {{#entries}} tr.entry-row(data-id='{{_id}}') td='{{date}}' td='{{title}}' td a.edit(title='Edit')='Edit' a.remove(title='Delete') // {{/entries}} 

奇迹般有效。 之后你可以删除评论,但是这至less可以做到这一点。

Emblem.js可能是Jade / Moustache方法的替代品,因为它看起来非常相似。 但是它需要Ember.js 。