AngularJS String with newlines, shown without breaks

Question

In the database I'm saving input from a textarea, where you can add breaks. But how to show them in a Angular view? For PHP this is nl2br().

Like <div>{{ item.foobar }}</div>, with breaks shown that are saved like that in the database.

Answer 1

Binding an HTML seems a bit unsafe. The directive suggested by CuriousGuy has a bit of extra engineering to correctly escape the HTML.

I find it easier to use a styling rule white-space: pre-line.

Example at JSFiddle.

See also:

• Mozilla Developer Network documentation for white-space
• Internet Explorer documentation for white-space
• W3 documentation for white-space