angularJS绑定数据时自动转义html标签教程

angularJS在进行数据绑定时默认是会以文本的形式输出，也就是对你数据中的html标签不进行转义照单全收，这样提高了安全性，防止了html标签中的注入攻击，但有些时候还是需要的，特别是从数据库读取带格式的文本时，无法正常的显示在页面中。

因此要对html进行转义，则要在数据绑定的html标签中使用ng-bind-html属性

（1）模板代码

<ul class="col">

<li ng-repeat="x in dt_records" ng-bind-html="TrustDangerousSnippet(x)">

{{x.dt_info}}

</li>

</ul>

（2）controllers.js控制器代码

//显示动态数据

$scope.dt_records = [

{

"dt_info" : '<em class=\"time\">jq** 33分钟前</em>兑换10元充值卡<em class=\"color-red\">使用1000积分<i class=\"icon icon-qiandai\"></i></em>',

},{

"dt_info" : '<em class=\"time\">ttt** 35分钟前</em>兑换10元充值卡<em class=\"color-red\">使用1000积分<i class=\"icon icon-qiandai\"></i></em>',

},{

"dt_info" : '<em class=\"time\">333** 38分钟前</em>兑换10元充值卡<em class=\"color-red\">使用1000积分<i class=\"icon icon-qiandai\"></i></em>',

},{

"dt_info" :'<em class=\"time\">444** 40分钟前</em>兑换10元充值卡<em class=\"color-red\">使用1000积分<i class=\"icon icon-qiandai\"></i></em>',

}

]

$scope.TrustDangerousSnippet = function(dt_records) {

return $sce.trustAsHtml(dt_records.dt_info);

};