conditional - jade テンプレートで条件付きを使用すると、レンダリング結果が正しくない

Question

まず、レンダー コードは次のとおりです。

ul
 li
  a

レンダリング結果は

 <ul>
  <li><a></li>
 </ul>

次に、条件を追加します。

 ul
  - if (temp == "blog") {
  li.active
  - } else {
  li  
  - }
   a

しかし、レンダリング結果は

<ul>
 <li.active></li>
 <a>
</ul>

私のコードの何が問題になっていますか? 最初のものと同じレンダリング結果を得るにはどうすればよいですか?

Answer 1

これを試して：

ul
  - if temp === "blog"
    li.active
      a
  - else
    li  
      a

ネストされた a を複製したくない場合は、次を使用できます。

ul
  li(class = (temp === 'blog') ? 'active' : '')
    a

メニュー リストやタブにも役立ちます。次のようにネストをインライン化できます。

ul
 li: a
 li: a.active
 li: a
// ...etc