WookieCoder WookieCoder - 5 months ago 101
Node.js Question

Pug `#{}` fails to load variable inside `onclick`

So I am using a javascript object to render a list of items. My object looks like this:

{
text: 'One',
url: 'index.pug'
},
{
text: 'Two',
url: 'Two.pug'
},
{
text: 'Three',
url: 'Three.pug'
}
}


The interesting part is when pug renders them. I am rendering them using something like this:

div
ul.horizontalScroll
each item in params.apps
li
a(onclick="loadXMLDoc(#{item.url})") #{item.text}


What I cannot figure out is why item.text renders correctly, but on click the link doesn't ping the function. In chrome inspector, I saw this:
<a onclick="loadXMLDoc(#)">One </a>
. Why is the argument not coming through as
index.pug
like it should??

Answer

Try concatenating the variable within the attribute:

a(onclick="loadXMLDoc('" + item.url + "')") #{item.text}
Comments