I'm working on a massive application that uses AngularJs.
When I view the page in IE8 I get super nifty console errors like Object doesn't support property or method 'module'
, Object doesn't support property or method 'widget'
, unable to get value of the property 'controller': object is null or undefined
, and IE really sucks, cant you just tell them to download chrome?
After fighting with it for a while I decided to log the typeof angular
, to which the console returned undefined
.
Everything works as expected in IE9, IE10, and all browsers that don't suck.
Please help!
Edit:
It appears that angular is undefined
before it gets to my first controller, so I don't think it has to do with the ieshim ...
I've been working with IE8 for six months now, feel your pain.
Without seeing your code it's hard exactly to say what's wrong
Here's a very very basic page I just tested with IE8, for you to compare against:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<meta charset="utf-8">
<title>Prompt Detail View</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- disable browser cache -->
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />
<!--[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]-->
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/angular-1.0.2.js" ng:autobind></script>
<script>
var pageModule = angular.module('pageModule',[])
.controller('pageCtrl',function($scope) {
$scope.foo = 'my foo';
});
</script>
</head>
<body>
<div ng-app="pageModule"
ng-controller="pageCtrl">
{{foo}}
</div>
</body>
</html>
So this was totally my bad (or the guy that started this app months ago).
My application controller had var angular = angular || {}
at the top, IE8 didn't agree with this declaration.
After removing that all is well.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With