Рендеринг новой строки из текстовой интерполяции в Angular 4 / Ionic 3

Question

У меня есть следующий передний код:

<p>{{ news.content }}</p>

news.content хранится в моей базе данных Firebase.

Как я могу отобразить новую строку в этой текстовой интерполяции без изменения моего переднего кода (ни HTML, ни CSS)? В конце концов я буду менять свой передний код, если это необходимо, но мне нужно быстрое исправление бэкэнда, потому что мое приложение в prod, и я не могу не предоставить обновление в течение дня...

Так я попробовал \n, <br /> а также 
 но никто не работает...

Когда я проверяю представление, HTML выглядит следующим образом:

<p>"my text"</p>

Так что, думаю, болевая точка исходит из двойных кавычек...

Просто чтобы вы знали, мне нужно это для работы над сборкой iOS.

Answer 1

Если я понял, вы хотите иметь возможность рендерить новую строку, благодаря объекту, который вы получили из вашего компонента.

Так что я думаю, что вы должны использовать [innerHTML] угловой и тому <br> тег ( https://angular.io/guide/template-syntax):

app.component.ts

export class AppComponent{
    sometext = 'some text';
    anothertext = '<br>new line here';
   ...
}

app.component.html

<p>{{sometext}} and <span [innerHTML]="anothertext"></span></p>