How to show the text with Line Breaks

Try render text inside <pre></pre> tag instead of <div>. Or use style="white-space:pre-wrap;" on your div.

Use the right CSS. The default style of the pre tag preserves line breaks:

<pre>{{text}}</pre>

or you can use CSS (white-space):

div {
    white-space: pre; /* or pre-wrap or pre-line */
    /* https://developer.mozilla.org/en-US/docs/Web/CSS/white-space */
}

Related