17

考虑这个伪服务器端代码

if(isFixed) {
  <div class="fixed">
} else {
  <div>
}
    <p>Inner element</p>
  </div>

我试着用玉做这个,但是......

 - if(mode === 'fixed') {
   div#tabbar
 - }
     p ...I cannot get this to be an inner element :(

它总是像这样呈现,</div>关闭:

<div id="tabbar"></div><p>I want this inside of the div</p>

我弄乱了缩进吗?谢谢!

4

3 回答 3

21

您需要将控制流与模板分开。尝试这个:

divClass = null

if isFixed
   divClass = "fixed"

div(class=divClass)
   p inner element

这反过来可能建议将“isFixed”参数分解到要传递的实际 divClass 参数中。但这当然取决于您剩余的代码/模板。


作为替代方案,请尝试使用 mixin:

mixin content
  p inner element

if (isFixed)
  div(class="test")
    mixin content
else
  div(class="other")
    mixin content
于 2013-01-19T14:56:15.697 回答
9

我会用三元(或完全写出的条件或方法)来确定类属性。这允许您将 div 保持在一行并保持缩进,就像对任何其他元素一样:

div(class="#{ isFixed ? 'fixed' : '' }")
    p Inner Element
于 2015-07-16T05:26:46.913 回答
2

Jade 似乎没有内置的解决方案来开始和结束标签,而不是使用“管道”字符来呈现纯文本。

- if(mode === 'fixed') {
| <div id="tabbar">
- }
| <p>I cannot get this to be an inner element :(</p>
- if(mode === 'fixed') {
| </div>
- }

不那么混乱的解决方案 -

div(class=(isFixed) ? 'fixed' : '')
  p inner element
于 2015-03-27T23:33:14.803 回答