Angular JS 适用于 Chrome，但不适用于 IE 11
Posted
技术标签:
【中文标题】Angular JS 适用于 Chrome，但不适用于 IE 11【英文标题】：Angular JS works in Chrome, but not IE 11 【发布时间】：2014-07-07 02:09:09 【问题描述】：我在以下位置选择 Angular JS： http://www.sitepoint.com/practical-guide-angularjs-directives/, 我发现以下代码在 Chrome 中有效，但在 IE 11 中无效。
<!DOCTYPE html>
<html ng-app="myapp">
<head>
<meta charset="utf-8" />
<title>No Title</title>
<script data-require="angular.js@1.2.x" src="http://code.angularjs.org/1.2.7/angular.js" data-semver="1.2.7"></script>
</head>
<body>
<input type="text" ng-model="color" placeholder="Enter a color..." />
<div data-hello-world />
<script>
var app = angular.module('myapp', []);
app.directive('helloWorld', function ()
return
restrict: 'AE',
replace: true,
template: '<p style="background-color:color">Hello World!!</p>',
link: function (scope, elem, attrs)
elem.bind('click', function ()
elem.css('background-color', 'white');
scope.$apply(function () scope.color = "white"; );
);
elem.bind('mouseover', function () elem.css('cursor', 'pointer'); );
);
</script>
</body>
</html>
具体来说，鼠标悬停和单击事件可以正常工作。但是，段落的背景颜色在 IE 中没有（颜色永远不会改变）。在 Chrome 中没问题。谢谢！
【问题讨论】：
尝试使用ngStyle 而不是经典的style 属性。
我试过 'Hello World!!
'，但它在 IE 和 Chrome 中都不起作用.我的报价快用完了...！单引号和双引号都已使用。 :( 转义引号 我尝试了 'Hello World!!
'，它在两种浏览器中都有效。谢谢！ 这个*** question还有其他几个解决方案。 【参考方案1】：可能是因为文档兼容性。这对我有用：
将此标签添加到 web.config。
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<clear />
<add name="X-UA-Compatible" value="IE=10" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
【讨论】：
这对我有用！我只是想确认 Angular 是否可以工作，因为我的公司已经很好地锁定了他们的 IE。所以，我只有一个非常简单的单行 Angular 表达式，没有控制器或类似的东西。在 IE 11 中不起作用，但在 Chrome 中会起作用。我改变的唯一区别是我使用“IE-11”而不是“IE-10”。 如果你在一个网站上工作并且不能让它离线来做这个改变，但是有一个 .master（如果是一个 asp.net 网站）文件然后添加 到 master 的 也是一个很好的解决方案。感谢下面的@James Gates R 的建议。【参考方案2】：使用 ng-style 标签而不是 style="CSS"。后者适用于 Chrome 和 Firefox，但不适用于 Internet Explorer
【讨论】：
【参考方案3】：在控制器之前尝试“使用严格”指令
"use strict";
function controller($scope)
// your code....
【讨论】：
【参考方案4】：我将以下内容添加到头部并且它起作用了。它与马克所说的非常相似......只是没有特定于 asp.net：
<meta http-equiv="X-UA-Compatible" content="IE=11" />
我还发现我需要在旧版本 IE 的 if 语句中添加响应和现代化：
<!--[if lt IE 9]>
<script src="/Binders/Scripts/modernizr-2.8.3.js"></script>
<script src="/Binders/Scripts/respond.js"></script>
<![endif]-->
【讨论】：
这是救命稻草。尽管到目前为止我的 angularjs 应用程序一直在愉快地使用 IE，并且即使我没有更改 angular.min.js 文件（它是 v 1.4.4），但这个问题在发布给客户端后一夜之间就出现了.我无法在工作时间让客户离线，但可以在网站的母版页上进行此更改以修复它，而无需取消其他所有会话。以上是关于Angular JS 适用于 Chrome，但不适用于 IE 11的主要内容，如果未能解决你的问题，请参考以下文章
Angular 6 MatSnackBar 适用于 Chrome 但不适用于 IE11
此 JS/jQuery 代码适用于 Firefox，但不适用于 Chrome
Node.js 应用程序适用于工头，但不适用于 heroku。 404 错误
为啥 jQuery 选择器适用于 Chrome，但不适用于 Safari？