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 piled 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?

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 piled 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?

• javascript
• dust.js

3 Answers 3

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).

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

You should use:

dust.optimizers.format = function(ctx, node) { return node };

Look at https://github./linkedin/dustjs/wiki/Dust-Tutorial#controlling-whitespace-suppression