Mustache js line break

Question

I am passing a text with line break to mustache but while rendering the line breaks are not shown. Please let me know , how to add line breaks in the text.

var test ="test1"+"\n"+"test2"+"\n"+"test3".

I am passing this to Mustache for rendering and expecting this should get printed like

test1
test2
test3

But the actual result is test1test2test3 while rendering this.

Thanks.

You must escape the html in the mustache template with this `{{{str}}}` — Quentin Roger, Apr 20 '16 at 07:21

score 13 · Accepted Answer · answered Apr 20 '16 at 07:18

13

You should use <br> but in your mustache template you must use {{{myString}}} to escape html

answered Apr 20 '16 at 07:18

Quentin Roger

6,410
2
23
36

score 5 · Answer 2 · edited May 23 '17 at 10:31

5

The best approach, in my opinion, is to apply the following CSS to the element you want to show with line breaks:

white-space: pre;

That way, all the \n will actually show as line breaks. There are also other ways of handling this, for example see Mustache.js allow only line breaks, escape other HTML.

edited May 23 '17 at 10:31

Community

1
1

answered Apr 20 '16 at 07:25

str

42,689
17
109
127

score 5 · Answer 3 · answered Feb 14 '19 at 14:48

5

white-space: pre-wrap, NOT white-space: pre (won't transfer a long string otherwise)

answered Feb 14 '19 at 14:48

Naskalin

895
9
9

score -1 · Answer 4 · answered Apr 20 '16 at 07:13

-1

New lines characters are not rendered in HTML, you ma use <br> instead:

var test ="test1"+"<br>"+"test2"+"<br>"+"test3"
var test ="test1<br>test2<br>test3"

answered Apr 20 '16 at 07:13

zessx

68,042
28
135
158

Mustache js line break

4 Answers4