angularjs表達式中的HTML內容,如何不轉義,直接表現為html元素


在模板中直接:

在ionic中直接使用:

<p class="contentwen" ng-bind-html="detial.content"></p> //轉譯了html

 

默認情況下,AngularJS對會對插值指令求職表達式(模型)中的任何HTML標記都進行轉義,例如以下模型: 
$scope.msg = “hello,<b>world</b>!” 
<p>{{msg}}</p> 
渲染過程會對b標簽進行轉義,他們會議純文本顯示而非標記; 
插值指令會對模型中任意html內容進行轉義,這是為了防止html注入攻擊。 
如果因為某種理由,包含html標記的模型要被瀏覽器求職和渲染,那么可以用ng-bind-html-unsafe指令來關掉默認的html標簽轉義: 
<p ng-bind-html-unsafe=”msg”></p>;

使用ng-bind-html-unsafe指令需要極度小心,它應被限制在你完全信任並控制的html標簽。

angularjs還有一個指令,ng-bind-html,它能夠選擇性凈化制定html標簽,同時允許其他標簽被瀏覽器所解釋,用法如下:

方法一: 
1.導入angular-sanitize.js 
2.在你app中報刊需要依賴的模塊,如下:

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

3.<p ng-bind-html=”msg”></p>;

方法二: 

1. 導入angular-sanitize.js 
2. 將其作為一個過濾器:

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

3.<p ng-bind-html=”msg | to_trusted”></p>;

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM