Pug/ Jade - entrée est une auto élément de fermeture: <input/> mais contient le contenu imbriqué?

Je veux créer le code html comme ceci:

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

Pug/Jade:

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

Mais j'obtiens une erreur:

entrée est une auto élément de fermeture: mais contient le contenu imbriqué.

Ça veut dire quoi? Comment je peux résoudre ce problème?

<input> élément ne peut pas contenir quoi que ce soit.

OriginalL'auteur laukok | 2016-07-10

  1. 10

    Il y a plusieurs manières de le faire à l'aide de Jade /Carlin. La première manière est d'utiliser un tuyau de char (ce qui nécessite une nouvelle ligne):

    input
  | text

    La deuxième façon est d'utiliser la balise d'interpolation (et vous pouvez rester sur la même ligne):

    #[input] text

    Donc une alternative Jethro la réponse serait:

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

    Notez que vous pouvez même le faire:

     label #[input] text

    Qui va générer:

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

    OriginalL'auteur Iso

  2. 6

    Vous aurez besoin de:

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

    Mettre Visible sur la même ligne que input, fait carlin interpréter comme de l'intérieur HTML de la input élément.

    OriginalL'auteur 1sloc

  3. 1

    Je crois que c'est un non-sens de mettre la input à l'intérieur de la label tag, ou pas? Vous pourriez faire

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

    Qui vous donne un parfaitement étiquetés bouton radio en accord avec moderne les standards du web.

    Pourrait, bien que ce n'est pas la Fpo exigence. Note que bien que votre lien explicitement les états "Astuce: Une étiquette peut être lié à un élément en utilisant le "pour" de l'attribut, ou en plaçant l'élément à l'intérieur de la <label> élément."
    Assez juste, j'ai oublié que. Merci! À partir d'une sémantique point de vue, je n'avais pas l'utiliser.
    J'obtiens toujours cette erreur input#first_name.form-control.input-sm.floatlabel(type="text", name="first_name", placeholder="First Name")

    OriginalL'auteur Flaudre