angularjs显示html文本

Angularjs中输出变量使用“{{}}”或者“ng-bind”，但是如果变量中有html代码的话，angularjs为了xss安全，默认是不解析html，直接原样显示html代码。

如果需要显示解析后的html代码，需要使用angular-sanitize模块。

控制器代码

demo.controller('Demo13Controller', [
'$scope', function($scope) {
$scope.html = '<span style="color: red">这是格式化的HTML文本</span>';
}
]);

视图代码

<article class="demo13" ng-controller="Demo13Controller">
<h2><a name="demo13">13.显示HTML文本</a></h2>
<div class="demo13-content">
<p>需要显示的文本：{{html}}</p>
<p>Html格式化文本： <span ng-bind-html="html|htmlContent"></span></p>
</div>
</article>

htmlContent过滤器代码

demo.filter('htmlContent',['$sce', function($sce) {
return function(input) {
return $sce.trustAsHtml(input);
}
}]);

线上demo：http://ngdemo.sinaapp.com/#demo13