AngularJs (all versions) breaks on IE11 in document mode ie=8 #4137

derbernd86 · 2013-09-24T13:52:53Z

Hello,
due to restrictions with legacy applications, my angularjs app is loaded in an iframe. The surrounding website has the document mode ie=8. <meta http-equiv="X-UA-Compatible" content="IE=8" />

So every website that is loaded within the iframe is also rendered in the ie8 documentmode.

Unfortunately Angular Js doesn't work in Internet Explorer 11 with the document mode ie=8 as described above.

I made a very simple example (see below) where this problem also occurs. It's based on an example of angularjs.org.

If you change the document mode e. g. to <meta http-equiv="X-UA-Compatible" content="IE=9" /> the example works.

This problem seams to appear in all angularjs versions. I tried 1.0.3, 1.0.8, 1.1.5 and 1.2.0-rc.2.

I hope you can help me.

Best regards
Bernd Hartmann

Sorry for the code here, but I didn't get the document mode run in an jsfiddle or Plunker.

1.) ie11testappframe.html

<!doctype html>
<html>
<head>
<title>AngularJs IE11 Test App Host</title>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<style type="text/css">
iframe{
width: 100%;
height: 500px;
}
</style>
</head>
<body>
<h1>AngularJs IE11 Test App Host</h1>
<p>below you see the iframe, where an angular js app is loaded</p>
<iframe src="ie11testapp.html">

</iframe>

</body>
</html>

2.) ie11testapp.html

<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
</head>
<body>
<div><label>Name:</label> <input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1></div>
</body>
</html>

The text was updated successfully, but these errors were encountered:

petebacondarwin · 2013-09-24T19:13:01Z

Would this be related to #4119?

petebacondarwin · 2013-09-24T19:17:43Z

When I tried this in IE10, it initially told me that the website was trying to run an ActiveX control. When I clicked allow then it all worked fine.

derbernd86 · 2013-09-25T08:00:34Z

Thank you for your response. In IE10 I got the same behaviour. But IE11 doesn't work at all.
This Bug is critical to me. Do you reflect those problems to Microsoft's IE11 team?
Is there a workaround or a simple bugfix to this issue?

petebacondarwin · 2013-09-25T10:03:42Z

OK, so the problem is that in angular.forEach: https://github.com/angular/angular.js/blob/master/src/Angular.js#L140
There is a call to obj.hasOwnProperty(key). IE11 in IE8 mode is saying that the obj, which is a DispStaticNodeList object, does not have this method!
It may be that the changes in #3331 will fix this.

derbernd86 · 2013-09-26T06:59:07Z

Thank you for your answer!
I changed the code of the angular.ForEach in https://github.com/angular/angular.js/blob/master/src/Angular.js#L140

Instead of obj.hasOwnProperty(key)
I changed it to Object.prototype.hasOwnProperty.call(obj, key)
This works for me, but I'm not sure if there are other situations where IE11 documentMode ie8 breaks relying on hasOwnProperty-Method.

I didn't find this change in your fix #3331?

petebacondarwin · 2013-09-26T11:25:34Z

Hmm, yes, the trouble is that Object.prototype.hasOwnProperty.call(obj, key) is orders of magnitude slower that just calling obj.hasOwnProperty(key) and so my PR tried hard not to change "hot" code.
I think that your situation is so specialized that we cannot implement such a change throughout the core just for it.
I suggest that you have your own fork of the project, where you do a simple search and replace for ".hasOwnProperty(". This should fix your problem.

mvcninja · 2013-12-17T19:41:45Z

The error is within the angularInit function, which is using foreach to iterate over the list of dom elements returned from element.querySelectorAll()
IE8 only supports querySelectorAll in standards mode, so this code won't be reached if using IE8 in quirks mode or IE7 compatibility mode. Adding an additional check for element.hasOwnProperty should bypass this code, which shouldn't be needed for IE8 as it's getting the app root by id.

Also, the consoleLog needs to check for typeof logFn === "function". IE8 throws an error on the check for console.log.apply, and IE7-8 returns typeof "object" for methods on the console object.

orias407 · 2014-03-04T07:25:28Z

I had the same issue but was solved when I used ngularJS v1.2.14.

pdorrestijn · 2014-10-16T15:41:18Z

I tried this with 1.2.14 and 1.3.0 in IE with and without setting X-UA-Compatible.
It does not appear to be fixed to me.

oliverbenns · 2014-10-24T00:59:57Z

Same issue here. 1.2.0, with X-UA-Compatible we get the error mentioned. Without X-UA-Compatible it does not render the page and we get no console logs.

petebacondarwin · 2014-11-18T14:45:38Z

Perhaps you might like to put together a PR with the fix suggested in #4137 (comment) ?
If you can prove it works with tests then it can go into the next 1.2 release.

jilanirony · 2015-09-07T14:07:34Z

just add below tag inside your head, it works like charm. IE=11 is the version of IE.

 <meta http-equiv="X-UA-Compatible" content="IE=11" />

ppsgppsi · 2015-12-11T20:06:58Z

jilanirony
just add below tag inside your head, it works like charm. IE=11 is the version of IE.

This worked for me and saved my deadline!

Additionally, IE11 refused to fetch libraries that it didn't "trust" such as

http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js

So i just copied them local. Off to the races!

Thanks Mr. Irony!

MarkPieszak · 2016-01-13T18:32:31Z

Also running into this problem myself.
IE11 document mode 8 just says "Module" is undefined...

VishnuYelapati · 2016-05-02T11:08:18Z

Instead of obj.hasOwnProperty(key)
I changed it to Object.prototype.hasOwnProperty.call(obj, key)
This works very fine for me

mohitqservice · 2016-09-27T12:16:07Z

Hello,
I am facing,angular2 project not work in IE Brower issue. Any one Please me to resolve this issue.

MarkPieszak · 2016-09-27T13:32:29Z

@mohitqservice This is for AngularJS (Angular1)

CoolSuplex · 2018-01-23T04:46:36Z

@petebacondarwin I am facing an issue with 'data-content' attribute ONLY in IE(just tried IE11).
AngularJS expression is not getting resolved in IE and is perfectly working in chrome and firefox,
data-content="{{::someCtrl.someArray['sometext']}}"
Any ideas are highly appreciated.
Thanks!!

petebacondarwin · 2018-01-25T11:09:36Z

@CoolSuplex - you problem does not seem related to this issue. Please open a new issue with a full reproduction of the problem if you feel it is a bug in AngularJS.

shaareable · 2018-04-08T18:34:16Z

In an Angular app, how do I put <meta http-equiv="X-UA-Compatible" content="IE=11" /> below the head?

ps: I am learning to code. Thank you.

parak80 · 2018-07-05T11:33:34Z

Hi, you should put the meta tag in the main html file inside the head tag

parak80 · 2018-07-05T12:29:50Z

I am using angular cli/angular 5 in my app and it run in IE browser but there are some css/bootstrap that are not following with, like my navbar, some colors that described as default color for buttons: var(); etc. They are not showing. Anyone has solution for this?

Oscar8401 · 2018-11-15T12:15:53Z

Hi,
I am facing this problem in IE11, I tried to set below the head, but the issue still exist som fiel are disabled on IE11 from the other side everything working correctly on edge.
Any idea how can I deal with this?

sdokic · 2019-06-03T17:06:04Z

The only fix that I found is to update tsconfig.json file. Change to "target": "es3" from whatever you have in your tsconfig.json.

petebacondarwin closed this as completed Sep 26, 2013

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

AngularJs (all versions) breaks on IE11 in document mode ie=8 #4137

AngularJs (all versions) breaks on IE11 in document mode ie=8 #4137

derbernd86 commented Sep 24, 2013

petebacondarwin commented Sep 24, 2013

petebacondarwin commented Sep 24, 2013

derbernd86 commented Sep 25, 2013

petebacondarwin commented Sep 25, 2013

derbernd86 commented Sep 26, 2013

petebacondarwin commented Sep 26, 2013

mvcninja commented Dec 17, 2013

orias407 commented Mar 4, 2014

pdorrestijn commented Oct 16, 2014

oliverbenns commented Oct 24, 2014

petebacondarwin commented Nov 18, 2014

jilanirony commented Sep 7, 2015

ppsgppsi commented Dec 11, 2015

MarkPieszak commented Jan 13, 2016 •

edited

Loading

VishnuYelapati commented May 2, 2016

mohitqservice commented Sep 27, 2016 •

edited

Loading

MarkPieszak commented Sep 27, 2016

CoolSuplex commented Jan 23, 2018

petebacondarwin commented Jan 25, 2018

shaareable commented Apr 8, 2018 •

edited

Loading

parak80 commented Jul 5, 2018 •

edited

Loading

parak80 commented Jul 5, 2018

Oscar8401 commented Nov 15, 2018 •

edited

Loading

sdokic commented Jun 3, 2019

AngularJs (all versions) breaks on IE11 in document mode ie=8 #4137

AngularJs (all versions) breaks on IE11 in document mode ie=8 #4137

Comments

derbernd86 commented Sep 24, 2013

petebacondarwin commented Sep 24, 2013

petebacondarwin commented Sep 24, 2013

derbernd86 commented Sep 25, 2013

petebacondarwin commented Sep 25, 2013

derbernd86 commented Sep 26, 2013

petebacondarwin commented Sep 26, 2013

mvcninja commented Dec 17, 2013

orias407 commented Mar 4, 2014

pdorrestijn commented Oct 16, 2014

oliverbenns commented Oct 24, 2014

petebacondarwin commented Nov 18, 2014

jilanirony commented Sep 7, 2015

ppsgppsi commented Dec 11, 2015

MarkPieszak commented Jan 13, 2016 • edited Loading

VishnuYelapati commented May 2, 2016

mohitqservice commented Sep 27, 2016 • edited Loading

MarkPieszak commented Sep 27, 2016

CoolSuplex commented Jan 23, 2018

petebacondarwin commented Jan 25, 2018

shaareable commented Apr 8, 2018 • edited Loading

parak80 commented Jul 5, 2018 • edited Loading

parak80 commented Jul 5, 2018

Oscar8401 commented Nov 15, 2018 • edited Loading

sdokic commented Jun 3, 2019

MarkPieszak commented Jan 13, 2016 •

edited

Loading

mohitqservice commented Sep 27, 2016 •

edited

Loading

shaareable commented Apr 8, 2018 •

edited

Loading

parak80 commented Jul 5, 2018 •

edited

Loading

Oscar8401 commented Nov 15, 2018 •

edited

Loading