why won't \n and work in a string?

Question

I'm trying to print out content in an object, and some of those properties have
tags in them which is why I can't just randomly create new elements in js because I don't know which properties will have
tags. But they're not rendering in my browser. I feel like I'm missing a very simple concept here... An example is provided below

JSFiddle: http://jsfiddle.net/tvzgypd6/3/

Here is just an example of an object that won't display properly when I use ng-repeat in angular

$scope.objs = [
    {a : 'test 1 <br> test 1'},
    {a : 'test 2 '},
    {a : 'test 3'},
    {a : "test 4 \n test 4"},
    {a : 'test 5 \n test 5'},
]

Answer 1

you can achieve it through CSS:

p {
    white-space: pre;
}

here a fork of your fiddle: http://jsfiddle.net/em0r3krw/

Answer 2

In order to show html you should use ng-bind-html and ng-sanitize:

angular.module('test', ['ngSanitize'])

<li ng-repeat="obj in objs">
    <p ng-bind-html="obj.a"></p>
</li>

In html \n won't actually add a new line. So you should use white-space: pre; as pointed out by zwacky:

p {
    white-space: pre;
}

JsFiddle