Interpolation

Pug provides operators for a variety of your different interpolative needs.

String Interpolation, Escaped ¶

Consider the placement of the following template’s locals: title, author, and theGreat.

title follows the basic pattern for evaluating a template local, but the code in between #{ and } is evaluated, escaped, and the result buffered into the output of the template being rendered.

This can be any valid Javascript expression, so you can do whatever feels good.

Pug is smart enough to figure out where the expression ends, so you can even include } without escaping.

If you need to include a verbatim #{, you can either escape it, or use interpolation. (So meta!)

String Interpolation, Unescaped ¶

You don’t have to play it safe. You can buffer unescaped values into your templates, too.

Tag Interpolation ¶

Interpolation works not only on JavaScript values, but on Pug as well. Just use the tag interpolation syntax, like so:

You could accomplish the same thing by writing an HTML tag inline with your Pug…but then, what’s the point of writing the Pug? Wrap an inline Pug tag declaration in #[ and ], and it’ll be evaluated and buffered into the content of its containing tag.

Whitespace Control ¶

The tag interpolation syntax is especially useful for inline tags, where whitespace before and after the tag is significant.

By default, however, Pug removes all spaces before and after tags. Check out the following example:

See the whitespace section in the Plain Text page for more discussion on this topic.