Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

IE9 error with ng-click and no href #7721

Closed
@zachsnow

Description

@zachsnow

In IE9, with hashbang mode enabled, and having injected the $location service (not just configured the provider), an anchor with an ng-click but no href causes an exception when clicked:

Unable to get the value of the property 'indexOf': object is null or undefined

To reproduce, put this in a file named ie9 and run python -m SimpleHTTPServer 5000, then visit http://localhost:5000/ie9/.

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <base href="/ie9/" />
    <script src="https://code.angularjs.org/1.3.0-beta.10/angular.js"></script>
  </head>

  <script>
    var app = angular.module('app', []);

    app.config([
      '$locationProvider',
      function($locationProvider){
        $locationProvider.html5Mode(true);
        $locationProvider.hashPrefix('!');
      }
    ]);

    app.controller('ctrl', [
      '$scope',
      '$location', // Note that we inject $location here!
      function($scope, $location){
        $scope.alert = function(s){ window.alert(s); };
      }
    ]);
  </script>

  <body ng-controller="ctrl">
    <a ng-click="alert('hi!')">
      <span>Click me!</span>
    </a>
  </body>

</html>

Note that you must inject $location to see the issue; the offending line is in $location and is only run when the service is instantiated.

There are several ways to "solve" the problem, but I'm not sure which is best. It seems that the implementation of the a (anchor) directive could stopPropagation as well as preventing default, or we could simply check for empty/undefined href attributes at that point in $location.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions