2015年4月17日 星期五

[AngularJS] Style, ng-style和天殺的IE

收到了一個IE 10會看不到圖片的bug, 昨天看了半天, 本以為在IE10沒正確載入遠端的資料(後來覺得我怎會蠢到這麼想), debug了半天(IE 10也沒很好的tool), 結果後來發現完全不是這麼一回事, 原本的code是這樣的:



<div style="background-image: url({{mydata.getImageUrl()}})"></div>


一開始也沒想到這邊, 看起來都沒問題, 但後來下面這樣的並沒問題:



<img src="{{mydata.getImageUrl()}}"/>


才發現原來AngularJS在IE10底下, 在style裡用{{變數}}會有問題, 解決的方法是要改用ng-style, 例如



<div ng-style="mydata.backgroundStyle()"></div>


而這裡的backgroundStyle是這樣的(不是string喔)



backgroundStyle = function() {
return {
backgroundImage: this.getImageUrl()
}
}




from Tumblr http://ift.tt/1cFDiId

via IFTTT