Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Pug/ Jade - input is a self closing element: <input/> but contains nested content?

I want to create the html like this:

<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

But I get an error:

input is a self closing element: but contains nested content.

What does it mean? How I can fix this?

like image 508
Run Avatar asked Jul 10 '16 18:07

Run


People also ask

Which elements are self-closing in Pug?

Pug also knows which elements are self-closing: img <img /> Block Expansion ¶ To save space, Pug provides an inline syntax for nested tags. a: img <a><img /></a> Self-Closing Tags ¶ Tags such as img, meta, and linkare automatically self-closing (unless you use the XML doctype). You can also explicitly self close a tag by appending the /character.

What is the syntax for nested tags in Pug?

img <img /> Block Expansion ¶ To save space, Pug provides an inline syntax for nested tags. a: img <a><img /></a>

Is input self closing or self closing element?

- Stack Overflow Pug/ Jade - input is a self closing element: <input/> but contains nested content? Bookmark this question. Show activity on this post.

How to show visible in Jade Pug?

There are multiple ways to do that using Jade / Pug. The first way is to use a pipe char (which requires a new line): Show activity on this post. Putting Visible on the same line as input, makes pug interpret it as the inner HTML of the input element.


1 Answers

You'll need to it like this:

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

Putting Visible on the same line as input, makes pug interpret it as the inner HTML of the input element.

like image 58
1sloc Avatar answered Sep 20 '22 05:09

1sloc