1. 程式人生 > >高亮顯示查詢的欄位==>>前端程式碼: 使用AngularJS框架

高亮顯示查詢的欄位==>>前端程式碼: 使用AngularJS框架

測試後發現高亮顯示的 html 程式碼原樣輸出,這是 angularJS 為了防止 html 攻擊採取的安全機制. 要用到$sce 服務的 trustAsHtml 方法來實現轉換。 通過 angularJS 的過濾器來簡化開發,這樣只寫一次,呼叫的時候就非常方便 一 先在前端的page.js中 編寫過濾器

// 定義模組:
var app = angular.module("xxx",[]);
/*$sce 服務寫成過濾器*/
app.filter('trustHtml',['$sce',function($sce){
return function(data){
return $sce.trustAsHtml
(data); } }]);

二 前端Html頁面使用過濾器 ng-bind-html 指令用於顯示 html 內容 豎線 |用於呼叫過濾器

<div class="attr" ng-bind-html="item.title | trustHtml"></div>