Pug / Jade - input是一个自闭元素：<input />但包含嵌套内容？

Question

我想像这样创建html：

<label class="radio-inline">
    <input type="radio" name="hidden" checked="" value="Visible"> Visible
</label>

帕格/翡翠：

label.radio-inline
    input(type="radio", name="hidden", value="0", checked="") Visible

但是我收到了一个错误：

  

input是一个自闭元素：但包含嵌套内容。

这是什么意思？我怎么解决这个问题？

Answer 1

There are multiple ways to do that using Jade / Pug. The first way is to use a pipe char (which requires a new line):

input
  | text

The second way is to use tag interpolation (and you can stay on the same line):

#[input] text

So an alternative Jethro's answer would be:

label.radio-inline
  #[input(type='radio', name='hidden', value=0, checked='')] Visible

Note that you can even do:

 label #[input] text

Which will generate:

<label>
  <input/> text 
</label>

Answer 2

你需要这样：

label.radio-inline
  input(type='radio', name='hidden', value=0, checked='')
  | Visible

将Visible放在与input相同的行上，使pug将其解释为input元素的内部HTML。

Answer 3

我认为将input置于label标记内是否废话无效？你可以做到

label(for="ya") Visible
input(id="ya", type="radio", name="hidden", value=0, checked="")

它为您提供了符合现代web standards的完美标记的单选按钮。