修复IE8中的AngularJS问题

Question

我已经在Firefox上使用AngularJS 1.2.13（和JQuery 1.11.0）开发了一个应用程序。 在Chrome上也可以正常使用。 现在是困难的部分。 我遵循了一些建议以使其在IE8上正常工作。

加载页面时，当前在开发工具窗口的JS控制台中得到非常有用的“ [object Error]”（什么也没有）。 该页面显示了已下载的原始html，因此Angular基本上无法执行任何操作。

这是我的index.html的顶部：

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="DiagApp">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!--[if IE 8]><!--> <meta http-equiv="X-UA-Compatible" content="IE=8" /> <!--<![endif]-->

即使我不处于怪癖模式（在开发工具窗口中，“文档模式”表示“ IE7标准”，而不是“怪癖模式”），我仍然得到以下信息：

  [$sce:iequirks] Strict Contextual Escaping does not support Internet Explorer version < 9 in quirks mode.  You can fix this by adding the text <!doctype html> to the top of your HTML document.  See http://docs.angularjs.org/api/ng.$sce for more information.

http://errors.angularjs.org/1.2.13/ $ sce / iequirks angular.js，第3689行，字符19

因此，我在模块的config函数中添加了以下内容，以解决此问题：

$sceProvider.enabled(false);

当我在“脚本”标签中查看HTML时，它们似乎都已正确着色，这向我表明它已正确验证（我早先在HTML中发现了一个错字，导致该错色不正确（Firefox和Chrome被忽略））。

我设置了断点以表明它正在加载我的模块，以及在主控制器中。 那表明我正在加载模块，但是从没有碰到我的主控制器。 我尝试在angularjs代码中设置一些断点，但是这导致了各种曲折的段落，没有明显的价值。

我听说有一些我应该用于<= IE8的polyfill，但是我只注意到有提到<= IE7的polyfill。

我还能尝试什么吗？

Answer 1

如果要在IE8中支持Angular应用程序，需要考虑几个因素，即：

• 您需要对JSON进行多过滤，以处理旧版IE版本本身不支持的字符串化和解析功能
• 您需要显式创建任何自定义HTML元素标签（IE8或更低版本不支持自定义HTML标签）
• 您需要摆脱任何杂乱的'doctype'废话，您需要使用“ ng-app”属性（我注意到您已经解决了这一问题）
• 您需要为IE 8本机不支持的某些JS函数创建polyfill，例如“ forEach”

从上面看到的HTML中，您似乎需要进一步修改HTML标头才能开始。 就我而言，我有一个共享的“ _Layout.cshtml”页面，在此页面中，我仅做一次以下更改：

<!--[if lte IE 8]>
        @Styles.Render("~/Content/iecss")
        <script src="~/Scripts/Libs/respond.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7/html5shiv.js"></script>
    <![endif]-->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!--[if lte IE 8]>
      <script>
        document.createElement('ng-include');
        document.createElement('ng-pluralize');
        document.createElement('ng-view');
        document.createElement('ng:include');
        document.createElement('ng:pluralize');
        document.createElement('ng:view');
      </script>
    <![endif]-->
    <!--[if lt IE 8]>
      <script src="~/Scripts/Libs/json2.js"></script>
    <![endif]-->
    <!--[if lte IE 8]>
        <script>
        document.createElement('my-editor');
        </script>
    <![endif]-->

Answer 2

当我必须支持怪癖模式时，我发现一旦您设置了$sceProvider.enabled(false); 并添加所有垫片，您还需要polyfill indexOf和filter 。 最近，我一直在使用https://github.com/es-shims/es5-shim来达到目的。