Display formatted HTML text with line break using CSS

Issue

Let's say I have this text:

$scope.text = 'This is the first line\nthis is the next line';

and i would like to show that in a div tag using agularJs

<div>{{text}}</div>

How do I show this text formatted WITH the line break? Now it displays like this:

This is the first linethis is the next line

Solution

Inline style for clarity

<div style="white-space: pre;">{{ text }}</div>

Answered By - Mikko Viitala