AngularJS 1.3拋棄了對(duì)IE8的支持，但AngularJS 1.2將繼續(xù)支持IE8，但核心團(tuán)隊(duì)已經(jīng)不打算在解決IE8及之前版本的問(wèn)題上花時(shí)間。本文檔介紹了互聯(lián)網(wǎng)瀏覽器（IE）在處理自定義HTML標(biāo)簽及屬性時(shí)的特點(diǎn)。如果你正計(jì)劃在IE8或更早的瀏覽器上部署Angular應(yīng)用請(qǐng)閱讀本文。
項(xiàng)目目前支持且將嘗試修復(fù)IE9以上的bug 。持續(xù)集成服務(wù)器在IE9，IE10和IE11上運(yùn)行所有的測(cè)試。詳細(xì)內(nèi)容參加Travis CI及ci.angularjs.org。
我們不在IE8及之前的瀏覽器上運(yùn)行測(cè)試。一些AngularJS的功能子集也許能夠在在這些瀏覽器上工作，但這將由你來(lái)測(cè)試并決定它在你的特定應(yīng)用上是否工作。
為確保Angular應(yīng)用在IE上能夠工作請(qǐng)確認(rèn)：
1. 在IE7或更早的版本上polyfill JSON.stringify。你可以使用JSON2或JSON3來(lái)polyfills。
<!doctype html>
<html xmlns:ng="http://angularjs.org">
<head>
<!--[if lte IE 7]>
<script src="/path/to/json2.js"></script>
<![endif]-->
</head>
<body>
...
</body>
</html>
2. 在連接處將id="ng-app"添加到根元素，使用ng-app屬性
<!doctype html>
<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
...
</html>
3. 你不能使用自定義的元素標(biāo)記，像<ng:view>(使用屬性版本<div ng-view>來(lái)代替)，或
4. 如果你必需要用自定義元素標(biāo)記，然后你必須采取以下步驟以確保IE8及之前版本都能用：
<!doctype html>
<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
<head>
<!--[if lte IE 8]>
<script>
document.createElement('ng-include');
document.createElement('ng-pluralize');
document.createElement('ng-view');
// Optionally these for CSS
document.createElement('ng:include');
document.createElement('ng:pluralize');
document.createElement('ng:view');
</script>
<![endif]-->
</head>
<body>
...
</body>
</html>
5. 使用ng-style標(biāo)記來(lái)替代style="{{ someCss }}"。后續(xù)的版本能夠在Chrome和Firefox下工作但不能在IE版本＜＝11下工作（在撰寫本文時(shí)的最新版本）。
重要部分是:
xmlns:ng- 命名空間- 你需要為每一個(gè)自定義標(biāo)簽指定一個(gè)命名空間。
document.createElement(yourTagName)- 創(chuàng)建自定義標(biāo)簽名 - 因?yàn)檫@只是對(duì)舊版本IE的問(wèn)題，所以你需要指定加載條件。對(duì)于每一個(gè)沒(méi)有命名空間并且在HTML中沒(méi)有定義的標(biāo)簽，你需要提前聲明以使得IE識(shí)別。
IE對(duì)非標(biāo)準(zhǔn)的標(biāo)簽元素有很多問(wèn)題。這些問(wèn)題可以歸為兩大類別，每一類別都有自己的解決辦法。
好消息是這些限制僅僅適用于元素標(biāo)記名稱并不適用于元素屬性名稱。因此，在IE中并不需要特別的處理：<div my-tag your:tag></div>
如果我不這樣做，會(huì)發(fā)生什么？
假如你使用HTML的未知標(biāo)記mytag（my:tag或者my-tag結(jié)果是相同的）：
<html>
<body>
<mytag>some text</mytag>
</body>
</html>
應(yīng)該解析出如下的DOM：
#document
+- HTML
+- BODY
+- mytag
+- #text: some text
預(yù)期的行為是BODY元素有一個(gè)mytag子元素，它帶有一些文字。
但是在IE中不是這樣的（如果沒(méi)有包含上面的修訂）
#document
+- HTML
+- BODY
+- mytag
+- #text: some text
+- /mytag
在IE中，BODY元素有三個(gè)子元素：
為確保CSS選擇器能夠在自定義元素上工作，自定義元素的名稱必須預(yù)先使用document.createElement('my-tag')創(chuàng)建，不需顧慮XML的命名空間。
<html xmlns:ng="needed for ng: namespace">
<head>
<!--[if lte IE 8]>
<script>
// 需要確認(rèn)ng-include被正常解析
document.createElement('ng-include');
// 需求啟用CSS引用
document.createElement('ng:view');
</script>
<![endif]-->
<style>
ng\:view {
display: block;
border: 1px solid red;
}
ng-include {
display: block;
border: 1px solid blue;
}
</style>
</head>
<body>
<ng:view></ng:view>
<ng-include></ng-include>
...
</body>
</html>
轉(zhuǎn)載自：http://www.weste.net/2014/7-3/97624.html
聯(lián)系客服
