AngularJS: Как отобразить данные html?

Question

Я реализую элемент управления для отображения списка комментариев с помощью AngularJS + Bootstrap.
Это что-то вроде этого: o.k

<div class="comments"> 
    <div ng-repeat="(id, comment) in person.comments" class="row"> 
     <div class="form-group"> 
     <div class="col-xs-12"> 
      <div class="input-group"> 
      <span class="input-group-addon vertical-align-top"> 
       <div><i>Date:</i> {{ comment.date }}</div> 
       <div><i>By:</i> {{ comment.author }}</div> 
      </span> 
      <div class="form-control form-control-content"> 
       {{ comment.content }} 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 

Все в ..
Проблема: comment.content является HTML-данные (например, он содержит разрывы строк, гиперссылок, стиль форматирования, ...). По умолчанию HTML отображается как обычный текст.

Вопрос: как мне отображать данные как HTML внутри div?

Answer 1

Вы можете использовать ng-bind-html.

<div class="form-control form-control-content" ng-bind-html="comment.content"></div> 

Answer 2

Если вы хотите {{comment.content}} быть истолковано как HTML, вы должны смотреть на ngBindHtml директивы.

Таким образом, вы должны были бы изменить его:

<div ng-bind-html="comment.content" class="form-control form-control-content"></div> 

Вы должны добавить $sanitize в ваших зависимостей проекта, как указано в ссылке ngBindHtml док выше.