如何捕获 ngSanitize 错误并将 html 显示为转义文本答案

【问题标题】：How can I catch ngSantitize errors and display the html as escaped text如何捕获 ngSanitize 错误并将 html 显示为转义文本
【发布时间】：2015-08-19 09:46:58
【问题描述】：

我们正在使用 AngularJS 尝试将用户输入的内容显示为 HTML。大多数情况下，用户输入我们使用 ng-bind-html 正确显示的有效/安全数据。有时他们会输入无效的 HTML，我仍希望将其显示为原始文本。

如果我使用 ng-bind-html 尝试显示无效的 HTML，我会收到以下错误：

[$sanitize:badparse] The sanitizer was unable to parse the following block of html:

我不想使用 trustAsHtml，因为我不信任我们的消毒剂，并希望确保我们不会在页面上显示不安全的 html。

【问题讨论】：

如果您想显示输入的原始文本，只需使用ng-bind 而不是ng-bind-html。
ng-bind 效果很好，但如果它有效，我想显示渲染的 html。

标签： html angularjs sanitization html-sanitizing

【解决方案1】：

根据ngBindHtmlDirective，你可以这样做：

HTML：

<div ng-if="isSafeHtml()">
  <div ng-bind-html="invalidHtml"></div>
</div>
<div ng-if="!isSafeHtml()">
  {{invalidHtml}}
</div>

JS：

$scope.isSafeHtml = function() {
   return !!$sce.getTrustedHtml($scope.invalidHtml);
}

修改plunkr：http://plnkr.co/edit/Besix3PfQ1TjUEEagfca?p=preview

【讨论】：

有趣的想法。这可能足以让我们度过难关。谢谢！

【解决方案2】：

我最终创建了一个指令来执行此操作。这是它的使用方法。

<div ng-bind-html-if-safe="SomeHtml"></div>

指令的来源可以在here找到。

【讨论】：