Question

让我们知道我们需要清理HTML字符串，我们不能使用ng-bind-html指令，例如：

<span data-toggle="tooltip" title="Edit {{customer.name}}">Text</span>

如果我们在customer.name中有特殊字符，则此行将打印为html版本，如é，我们需要é。

我测试过：

$sce.trustAsHtml(customer.name)
$sce.parseAsHtml(customer.name)

但没有任何东西可以＆＃34;翻译＆＃34;这个HTML。怎么可以这样做？

一个简短的解释是：如何在指令内清理html（不在ng-bind-html的正文中）。

Answer 1

它不一定非常复杂。

相反，在元素上使用setAttribute和textContent（V.S。innerHTML），浏览器本身将为您进行消毒。

// To set element attributes
$span.setAttribute("title", "Edit" + customer.name);

// To set element content
$span.textContent = customer.name;

有关详细信息，请参阅the post here。这些当然是一次性绑定，因此如果您需要更新，只需将$watch扔到中间。

Answer 2

来自oficial documentation：

ngBindHtml使用$ sce.parseAsHtml（绑定表达式）。这是实际代码（略微简化）：

var ngBindHtmlDirective = ['$sce', function($sce) {
  return function(scope, element, attr) {
    scope.$watch($sce.parseAsHtml(attr.ngBindHtml), function(value) {
      element.html(value || '');
    });
  };
}];

所以我认为您需要的只是$sce.parseAsHtml（https://docs.angularjs.org/api/ng/service/$sce#parseAsHtml）。

如果无论如何都无法说服角度来打印HTML，您可以尝试使用

customer.name.replace(/&eacute;/g, String.fromCharCode(233));

您可以在此处找到一些基本代码：http://www.javascripter.net/faq/accentedcharacters.htm

这应该有效，但它绝对不是最好的解决方案。您应该始终使用ng-bind-html。

AngularJS和Sanitize - 在没有ngBind指令的情况下清理HTML

2 个答案: