In a jade template (using express over node.js), I see a template using the following syntax:

script(type='text/template', id='data-services') !{data}

I don't understand the !{ } construct; apparently it interpolates a javascript object defined elsewhere as:

var data={ name:"Doe", age:"21" };

Jade docs & tuts show the use of #{ } for interpolation, but I don't see !{ }. Even #{ } is not documented, so I think it's not jade-specific. Where does this syntax come from and where is it documented?

In a jade template (using express over node.js), I see a template using the following syntax:

script(type='text/template', id='data-services') !{data}

I don't understand the !{ } construct; apparently it interpolates a javascript object defined elsewhere as:

var data={ name:"Doe", age:"21" };

Jade docs & tuts show the use of #{ } for interpolation, but I don't see !{ }. Even #{ } is not documented, so I think it's not jade-specific. Where does this syntax come from and where is it documented?

• javascript
• node.js
• pug

• 1 Good question. Quite annoying that jade-lang.com doesn't even explain this! – Kokodoko Commented Dec 17, 2015 at 12:16
• It's in the pug documentation now: pugjs.org/language/… – Suzana Commented Feb 12, 2019 at 12:14

1 Answer 1

Quite difficult to find it, indeed. Have a look at this resource:

http://naltatis.github.io/jade-syntax-docs/#escaping

# is used when you want to escape data and ! when you want it raw.

For example let's say that name = "Hello <em>World</em>". Then you have:

#{name} --> Hello <em>World</em>
!{name} --> Hello <em>World</em>

Think about it like that: # will display name as it is written while ! will treat it as HTML.