将pug mixin传递给JavaScript

Question

I have a common modal all over my site for showing endnotes. I wanted to create a quick pug mixin so I don't have to type the structure over and over.

However, I don't know how to pass the #id into my js toggle_visibility function. (Note, the js works perfectly, I'm just trying to convert to a mixin)

mixin modal(id, content)
 div.modal(class= id)
  div.modal-content= content
   a.close(onclick="toggle_visibility('= id');") Close 

Here's an example of the pug code working (outside the mixin)

div.modal#downloads-citations
      div.modal-content
        p some content here to show article citations
        a.close(onclick="toggle_visibility('downloads-citations');") Close

Answer 1

What you're looking for is called 'attribute interpolation', and is not directly supported anymore in current versions of Pug (see this page in their docs).

Fortunately, however, there is an easy workaround, based on the concatenation of strings. Just replace the last line of your code snippet with this statement:

a.close(onclick="toggle_visibility('" + id + "');") Close