AngularJS on Internet Explorer

Member 12586674

5.00/5 (3 votes)

Dec 6, 2016

CPOL

11050

Working with AngularJS on Internet Explorer

Introduction

This snippet can be used while working with AngularJS on Internet Explorer.

Background

While I was working with AngularJS for the first time, I had an issue with Internet Explorer. My code used to work on Firefox, but I was having trouble working with it on Internet Explorer. So, I thought of sharing this simple solution.

Using the Code

Below is a sample View (.cshtml) of the application.

<!DOCTYPE html>
<html>
<head>
<script src="/angular.min.js" type="text/javascript"></script>
<script src="/jquery-3.1.1.min.js" type="text/javascript"></script>
<script>
var app = angular.module("MyApp", [])
app.controller('MyCtrl', function ($scope) {
  $scope.YourFunction= function () {
    //Your code here
  }
});
</script>
</head>
<body>
<div ng-app="MyApp" ng-controller="MyCtrl">
</div>
</body>
</html>

My page used to work fine in Firefox, but I was facing problems with the Internet Explorer browser.

It threw many errors like below:

SCRIPT5009: 'Node' is undefined
File: angular.min.js, Line: 184, Column: 339

SCRIPT438: Object doesnt support property or method 'addEventListener'
File: jquery-3.1.1.min.js, Line: 6, Column: 123

To solve the error, you just need to add the below line to your <head></head> tag:

<meta http-equiv="X-UA-Compatible" content="IE=Edge, width=device-width, initial-scale=1" />

This worked for me in Internet Explorer.

Add your solution if anyone has any other solution.

Thanks!