1. 程式人生 > >angularjs 高階玩法 建立遞迴的模板 相容IE瀏覽器

angularjs 高階玩法 建立遞迴的模板 相容IE瀏覽器

說到相容IE7 IE8瀏覽器,angularjs官方已經明確說明:v1.3 之後的版本(含v1.3)都將不支援 IE7 IE8了,所以如果想要相容IE7 IE8 就必須使用 v1.3以下的版本

上一篇文章說到遞迴玩法,但是IE7 IE8是玩不通的,原理我簡單解釋一下,

angularjs在載入一個模板的時候,會進行解析內容,把內容轉換成Element(元素或者說節點),這裡問題就來了,在IE9+ 、chrome這些瀏覽器,會把 <script>這種標籤也當作是一種Element來處理,但是在IE7 IE8則不會,因此,載入模板時,angularjs不會把script的內容放到$templateCache快取中,而ng-include實際上就是在$templateCache快取中取模板的,所以ng-include取不到script的內容,導致IE7 IE8沒有顯示我們想要的結果

解決辦法:

既然問題已經知道,那麼我們只要在ng-include獲取$templateCache的script之前,往$templateCache插入一個遞迴的程式碼,那就解決了

$templateCache有兩個方法我們可以用到,get 和 put,

$templateCache.get( key )

$templateCache.put( key, value )

我們可以在控制器中,呼叫$templateCache.put方法,把原本script的id作為key,script裡面的內容作為value,傳給$templateCache那就可以實現原本的遞迴功能了