node.jshtmlexpresspugpug-loader

How to add new lines into a variable passed into pug


I am trying to pass values that need to include new lines/brake lines into pug files.

So far I have tried

var value1 = "value 1";
var value2 = "value 2";
var infromation = "\n" + value1 + "\n" + value2;
res.render('pugfile', { information: information });

but when this is rendered in pug through

p Your messages are: #{information}

The html is rendered as

<p> 
value 1
value 2
</p>

but the new line is not shown on the displayed webpage, which is the problem. Please help?


Solution

  • instead of putting \n for newline, use <br> for break. And also you need to escape the string. For reference check this.

    Try this.

      let value1 = "value 1";
      let value2 = "value 2";
      // let information = "\n" + value1 + "\n" + value2;
      let information = "<br>" + value1 + "<br>" + value2;
      res.render("index", { information: information });
    

    And in pug template

    p Your messages are: !{information}
    

    Please check here for working code