pug - 为什么 Jade 抱怨插值变量未定义？

Question

当我编译以下代码片段时，Jade 抱怨 user_name 和 user_level 未定义：

div.outer
     div.info
         div.user_name  #{user_name}
         div.user_level span.level "LV."+#{user_level}

为什么？

Answer 1

我传递了下一个变量：{"user_name": "Bob","user_level": "admin" }这里没有错误

这些：

div.outer
    div.info
        div.user_name  #{user_name}
        div.user_level span.level "LV."+#{user_level}

编译成这些：

<div class="outer">
    <div class="info">
        <div class="user_name"> Bob</div>
        <div class="user_level">span.level "LV."+admin</div>
    </div>
</div>

那么问题来了：<div class="user_level">span.level "LV."+admin</div>

我的测试在以下情况下运行良好：

div.outer
     div.info
         div.user_name  #{user_name}
         div.user_level
             span.level LV.#{user_level}  <----Here you want the dot?

编译成：

<div class="outer">
    <div class="info">
        <div class="user_name">Bob</div>
        <div class="user_level"><span class="level">LV.admin</span></div>  <---Looks better.
    </div>
</div>

希望能帮助到你

第 2 部分：for & each示例。

通过{"books": ["A", "B", "C"]}

select
  each book, i in books
    option(value=i) Book #{book}

编译成：

<select>
  <option value="0">Book A</option>
  <option value="1">Book B</option>
  <option value="2">Book C</option>
</select>

和

ul
  for book in books
    li= book
  else
    li sorry, no books!

编译成：

<ul>
  <li>A</li>
  <li>B</li>
  <li>C</li>
</ul>

我们通过的情况：{"books": []}

编译成：

<ul>
    <li>sorry, no books!</li>
</ul>