AngularJs 取消对 html 字符串标签转义

摘要: angularJs 在进行数据绑定时默认是会以文本的形式输出，对数据中的 html 标签会进行转义。

有时我们需要在页面中输出含有 html 标签的字符串，但标签在页面上却被 angularJs 自动转义了，在页面上 html 标签不生效。（标签会转义成字符串在页面上输出）

$scope.discountDesc = "测试 <br /> 换行"; //页面输出 :“测试 <br /> 换行”

<div ng-bind="discountDesc"></div>

这时我们要使 <br /> 标签生效，则需要使用 $sce 安全机制来输出 html

$scope.discountDesc = $sce.trustAsHtml("测试 <br /> 换行");

<div ng-bind-html="discountDesc"></div>

//页面输出 :

//测试

//换行

$sce 是 angularJS 自带的安全处理模块，$sce.trustAsHtml(str) 方法便是将数据内容以 html 的形式进行解析并返回。将此过滤器添加到 ng-bind-html 、data-ng-bind-html 所绑定的数据中，便实现了在数据加载时对于 html 标签的自动转义。