wrapping text in an angular interpolated binding

user_59546 0
Viewed 199

I'd like to do something like this, where I'm trying to keep the line breaks that I have in the data.

<div>    
   <p> {{outputline}} </p>
</div>

where outputline is hello\r\nworld or hello<br>world

Both of which I've tried. I can do it in a more complex way with outputline1, outputline2, etc.

Any suggestions?

angular css
2 Answers

Try <p [innerHTML]="outputline"></p>

user_65621500

For hello\r\nworld, you can add

p {
  white-space: pre;
}

in you css, or <pre> instead of <p> in your template.

user_119281940
Related