If it is not difficult, then I would like to make out on examples, thanks in advance. Jade is using the Express framework on Node.JS.

  • one
    Advice, add tags of programming languages ​​with which your template engine is associated, it will increase the interest of the audience! - Palmervan

1 answer 1

Just try:

my_var = 'test <a href="#">test</a>' p #{my_var} p !{my_var}

In the first case, Jade escapit html, in the second no. Those. when you pass a piece of html code, markup to the template, then you need to use! {}, and if this is the text where you want to show it to display a piece of code (in the comments someone posted it for example), then # {} html, and on the page the text html will be displayed (the source will be &lt; and &gt; ).

 let $ = q => document.querySelector(q); $('#result').innerHTML = jade.compile($('#template').innerHTML)({my_var: 'test <a href="#">test</a>'}); 
 <script src="//cdnjs.cloudflare.com/ajax/libs/jade/1.3.1/jade.min.js"></script> <script type="text/template" id='template'> p #{my_var} p !{my_var} </script> <div id='result'></div>

UPD Playground

  • @Yura Ivanov, thanks for the answer, I already seem to understand. The HTML service characters are escaped by the spec. character sets. But to fully understand, can you explain this line of code? The render is passed to the img_list array, and javascript processes it, why in this case! {}? script var list =! {JSON.stringify (img_list)}; - Pifagorych 8:04 pm
  • just so that nothing changes. JSON.stringify will give you a bunch of double quotes that the jade for # {} will cheerfully replace with & quot; and instead of var list = [{"src": "img.png"}, {"src": "img2.png"}]; //! {} get a var list = [{& quot; src & quot;: & quot; img .png & quot;}, {& quot; src & quot;: & quot; img2.png & quot;}]; // # {} Shl approximately the same meaning has the filter | raw for swig. - Yura Ivanov
  • Although ... maybe quotes in this case may not be escaped, but this does not negate the fact of screening other characters in img_list itself. In any case, if you need to get a fixed string, you should use! {}. Even if your json will contain html entities, they will already be escaped, and in addition they should not be escaped. As for # {}, this is for user data, such as: document.getElementById ('user'). InnerHTML = # {user.name}; Here user.name can contain any characters, and they will not affect the markup of the entire page. - Yura Ivanov
  • And hell, as I myself could not figure it out, it's so simple it turned out. Thank you very much! Plus the link with the service made it possible to experiment) - Pifagorych