在Internet Explorer 7上运行AngularJS应用程序

问题描述：

为了确保AngularJS能够在我需要的浏览器上运行，我做了一个简单的数据结合演示，它可以在Firefox，Chrome和IE8 +上正常工作，但我也需要使它在IE7上运行。不幸的是，我无法让它工作。它只显示带有花括号的html，而忽略ng-属性。在Internet Explorer 7上运行AngularJS应用程序

我已经在Internet Explorer检查several posts about AngularJS，并试图对每一个建议的修复，但没有工作在我的演示。

这是我的演示的HTML：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Angular IE7 Test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<!--[if lt IE 9]> 
<script type="text/javascript" src="angularjs/html5shiv.js"></script> 
<![endif]--> 
<!--[if lt IE 8]> 
<script type="text/javascript" src="angularjs/json3.js"></script> 
<![endif]--> 
<script language="JavaScript" src="angularjs/angular.min.js"></script> 
<script language="JavaScript" src="angularjs/test.js"></script> 
</head> 
<body class="ng-app"> 
    <div ng-controller="serversCtrl"> 
     <p>{{texto}}</p> 

     <table border="1"> 
      <tbody> 
       <tr><th>Col1</th><th>Col2</th><th>Col3</th></tr> 
       <tr ng-repeat="item in items"><td>{{item.col1}}</td><td>{{item.col2}}</td><td>{{item.col3}}</td></tr> 
      </tbody> 
     </table> 
    </div> 
</body> 
</html>

这是JavaScript的包含控制器的test.js和型号：

function serversCtrl($scope, $http, $location) { 
    $scope.texto = "Texto dinamico"; 
    $scope.items = [ 
     {col1: "foo1", col2: "bar1", col3: "baz1"}, 
     {col1: "foo2", col2: "bar2", col3: "baz2"}, 
     {col1: "foo3", col2: "bar3", col3: "baz3"}, 
     {col1: "foo4", col2: "bar4", col3: "baz4"}, 
     {col1: "foo5", col2: "bar5", col3: "baz5"} 
    ]; 
}

难道我做错了什么？是否有任何其他技巧可以让我失去作用？

编辑：我使用AngularJS V1.0.5

是的，你做错了什么！ IE7支持对任何人都不好。 – themihai 2013-10-20 08:54:22

答

一些更多的阅读后，我可以使它发挥作用。

IE7的问题是引导。它没有开火！所以我做了一个手动初始化，如this page所示，它工作。

这是我加入HTML保证它的代码将仅在Internet Explorer 8或更低（因为如果我火了所有浏览器的一些事件处理程序触发两次非IE浏览器）：

<!--[if lte IE 8]> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     angular.bootstrap(document); 
    }); 
</script> 
<![endif]-->

$document.ready()部分是jQuery的方式，以确保此代码将被执行时身体上的所有内容已被加载，但自从我在我的网站上使用jQuery我利用了它。

您可以给我看一个JSFiddle或Plnkr的例子吗？我无法得到他的工作，我真的很感激一个工作的例子。 – 2015-01-28 12:11:27

答

1）添加id="ng-app"你的身体标记。

<body ng-app="myApp" id="ng-app">

2）通知用户/客户端这是2013年

其实我也试过用id =“ng-app”作为class =“ng-app”的替代方法，但是他们都没有解决我的问题。在我的国家（萨尔瓦多），人们仍然不幸地使用Windows XP和Internet Explorer 6和7，但我们正在说服他们升级的过程中。感谢您的回答。 – 2013-04-10 15:24:39

'id =“ng-app”'不意味着替代。两者都需要，'ng-app =“myApp”'和'id =“ng-app”'。 – Stewie 2013-04-10 17:05:17

+51

步骤2的+1 ... – Stirling 2013-05-15 18:28:32

在Internet Explorer 7上运行AngularJS应用程序

相关推荐