There are a lot of similarities between the way organisations manage their use of ancient browsers and they way the ‘The Coalition of the Willing’ managed Gulf War II.

There’s no exit strategy.

Ok, that’s really the only similarity I can come up with. After that the metaphor falls flat on it’s face, and trivialises the misery and suffering of millions of people, the horrific cost and the subsequent reduction in people’s quality of life.
Then again… IE7…

Microsoft will no longer support IE7 after January 2016 (excepting embedded OS versions). However your client may still want to support IE7. Given that a requirement from your client is that it must support IE7 (too expensive to upgrade, can’t upgrade due to dependencies, terrified of losing their customers who use IE7), you just gotta get on with it.

So, how to manage IE7 and more modern browsesrs? Well, it’s gonna cost you - in terms of what features you can use of modern browsers.

generator-angular, the yeoman scaffolder for AngularJS apps, has been going for a couple of years and produce new versions frequently. The last release to ‘unofficially’ support IE7 and officially support IE8 was v0.8.0.

Installing Dependencies

So you need generator-angular and it’s dependencies. Using your OS’s package manager install;

  • NodeJS
  • Ruby
  • The Ruby ‘Compass’ gem.

Install Node Packages

1
2
npm install -g yo grunt-cli karma-cli
npm install -g generator-angular@v0.8.0

Modification to Your Project

Generate a project

1
yo angular ie7-support-example

Minimally, there are a couple of changes yo need to make to support IE7.

In index.html you need to set the id attribute of the body tag to ng-app

1
<body id="ng-app" ng-app="ie7-support-example">

Add the bower component angular-ie7-support, and then make it a dependency of your angular app.

1
2
3
4
5
6
7
8
<body id="ng-app" ng-app="ie7-support-example">
angular.module('ie7-support-exampl', [
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'ngRoute',
  'ie7-support'
])

The should be it :-)