How to pass a Node.js variable to the inside of a Pug script tag?
Normally in pug you can substitute variables like that, but we're in a Plain Text block when we put the period at the end of the script tag and regular variable substitution doesn't work in these blocks:
script. ^
In order to output dynamic JavaScript in a Plain Text block we need to use unescaped interpolation to do it with !{...}
.
If you are just trying to output a single string value just put quotes around the interpolation tag:
var currentuser = '!{username}';
When you have a more complex JavaScript object you can stringify the variable, and you won't need quotes for this as it's valid JavaScript output.
route:
res.render('test', { user: {"name": "Joe Smith"}});
template:
var currentuser = !{JSON.stringify(user)};
outputs:
<script>var currentuser = {"name":"Joe Smith"};</script>
In case you're curious, the #{...}
escaped interpolation inserts invalid characters and looks like this:
template:
var currentuser = #{JSON.stringify(user)};
outputs:
<script>var currentuser = {"name":"Joe Smith"};</script>
A simple trick to do this:
- Create an input hidden in HTML section with special id (I'm using
#username
in example code below) - Get value from input by Id in JS section
//- HTML Sectioninput(type='text', id='username', value= username)//- Script Sectionscript. var currentuser = document.getElementById("username").val();