如何在 AngularJS 中使用 ng-bind-html-unsafe？

【问题标题】：How use ng-bind-html-unsafe in AngularJS?如何在 AngularJS 中使用 ng-bind-html-unsafe？
【发布时间】：2015-03-18 09:37:22
【问题描述】：

我使用编辑器添加评论，并将此内容保存为 db 中的 html。当我想在页面中显示它时，所有 html 元素都会出现在输出中。所以我想使用this 代码来解决我的问题但没有解决。

这是我的代码

数据包括 {body, name, date}，body 保存为 html

  <div ng-repeat="d in Data">
       <div class='content'>
           <div ng-bind-html-unsafe="d.body">
                 <p>{{d.body}}</p>
           </div>
        </div>
  </div>

【问题讨论】：

您使用的是哪个角度版本？您可能需要包括 angular-sanitize
ng-bind-html-unsafe 已在最新版本中被弃用，您需要使用 $sce 服务然后将 html 设为$sce.trustAsHtml

标签： html angularjs

【解决方案1】：

在 jsfiddle 里面的一个问题是使用 ng-bind-html-unsafe 工作的 angular 1.1。

但目前 Angular 已从最新版本中弃用 ng-bind-html-unsafe，而您需要使用 ng-bind-html 然后使用 $sce 服务和 $sce.trustedAsHtml() 从角度过滤器中清理该 URL

过滤器

app.filter("sanitize", ['$sce', function($sce) {
        return function(htmlCode){
            return $sce.trustAsHtml(htmlCode);
        }
}]);

HTML

  <div ng-repeat="d in Data">
       <div class='content'>
           <div ng-bind-html="d.body | sanitize">
                 <p>{{d.body}}</p>
           </div>
        </div>
  </div>

更多信息请参考SO answer

【讨论】：