angular輸出html

在用angular作爲前端搭建個人博客的時候,發現用angularJs輸出html的時候,瀏覽器並不解析這些html標籤,不知道angularjs如何實現這種功能的。

但是這裏我們需要其顯示angular輸出的html能被瀏覽器解析怎麼辦呢?

通過api,發現通過指令 ng-bind-html來實現html的輸出。

<div class="col-md-12 ng-binding" ng-bind-html="item.content ">

但是並不起作用,瀏覽器中顯示的還是html代碼。

‘後來發現還需要通過通過$sce服務來實現html的展示。

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

這裏通過$sce構建一個過濾器來對輸出的html進行過濾

<div class="col-md-12 ng-binding" ng-bind-html="item.content|to_trusted ">
這樣就可以通過angularjs正常的輸出html標籤,並且被瀏覽器解析了
發佈了81 篇原創文章 · 獲贊 12 · 訪問量 53萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章