AngularJS使用ng-bind-html会过滤html中style属性的问题

(171) 2024-03-28 09:01:01

要将下列字符串作为html进行显示

字典导入开始</br></br>正在处理机构字典:肇庆市政府</br>即将覆盖已存在的同名字典</br>关联人物字典:赖泽华将会被提交到数据库</br>关联人物字典:刘惠祥将会被提交到数据库</br><span style='color:red'>关联人物字典:陈定坤失败</span></span></br><span style='color:red'>关联人物字典:李天失败</span></span></br>

在模板中直接使用,

<div ng-bind-html="object[field.key]"></div>

style和会被忽略,看到在其它地方有前辈用

<div ng-bind-html="myHTML(dictImportMessage)"></div>

正常显示了,但是我用ng-bind-html=”myHTML(object[field.key])”什么都没显示,暂时还不知道为什么。于是找度娘,找到以下解决办法:
1、导入angular-sanitize.js
2、将其作为一个过滤器:

angular.module('myApp') .filter('to_trusted', ['$sce', function($sce){ 
    return function(text) { 
    return $sce.trustAsHtml(text); }; }]);

3、

<div ng-bind-html="object[field.key]| to_trusted"></div>

然后显示就正常了。
还有一种方法,没有试
1.导入angular-sanitize.js
2.在你app中报刊需要依赖的模块,如下:

var app = angular.module('myApp', ['ngSanitize']);

3.

<p ng-bind-html=”msg”></p>;
THE END

发表回复