angular routing ie9 error

Question

In IE9 my angular routing does not work and it redirects me to whatever was before the '#' hashtag.

mysite.com/#/info -> mysite.com

even if i manually removes the /# from the URL and try again, i still get redirected.

It appends '#' to my URL because html5 mode uses History API when the browser supports it, and falls back to 'hashbang' (#) when it is not supported(like IE9).

$locationProvider.html5Mode(true);

$urlRouterProvider.otherwise("/");

$stateProvider
  .state('statistics', {
      url: "/path/:myId",
      templateUrl: '../some/path/site.html',
      controller: 'Ctrl'
  }
);

been looking at various solutions such as:

but neither of them are working for me.

I'm looking for a solution without having to deactivate html5mode. Anyone experienced similar issue and managed to fix?

Refer this solution: http://stackoverflow.com/questions/26140575/angularjs-ng-route-not-working-on-ie9-the-views-are-not-displayed — Diksha Tekriwal, Apr 27 '16 at 14:04
@TekriwalD already added meta tag, ng-app in body, no console logs :/ its not really the same issue either. — Anders Pedersen, Apr 27 '16 at 14:34

score 0 · Answer 1 · answered Apr 27 '16 at 13:42

In HTML5 mode, there are three situations in which the A tag is not rewritten: from the angular docs - 1 Links that contain a target attribute. Example: link 2 Absolute links that point to a different domain Example: link 3 Links starting with '/' that lead to a different base path when base is defined Example: link

You can try to use a global directive like this that add target='_self' to all all links without target.

myApp.directive('a', [function () {
return {
    restrict: 'E',
    link: function (scope, element, attrs) {
        if (!attrs['target']) {
            element.attr('target', '_self');
        }
    }
}
}]);

angular routing ie9 error

1 Answers1