Dust.js escape characters

Question

I am trying to print a newline and per the Dust.js guide, in the template I have a {~n} at the end of each record output

{#friends} {name}, {age}{~n}{/friends}

I compiled the above template and am rendering with a couple of JSON records to generate 'out' object. I am using the document.getElementById('divID').innerHTML to replace the 'out' object dynamically in a basic DIV tag. The problem is am not able to print newline inspite of the {~n}. I have also tried {~r}, but still not luck. Any thoughts?

Answer 1

HTML collapses adjacent whitespace (including newline characters) into a single space by default. There is no difference between a word and a \n word (or a \r word or a \r\n word for that matter) by default for most elements. The solution is either to:

• Use a <br> element to add the break
• Set the style on your div to be whitespace: pre;

Alternately, you can use a list (which is probably more semantic for your use case and should be preferred).

Answer 2

If you're rendering as HTML, you need to use a <br> tag instead of a newline.