AngularJS: "Error: Unexpected call to method or property access.undefined" only in IE 8

Question

Have you ever had the error "Error: Unexpected call to method or property access.undefined" only IE8? What was causing it? How did you solve it?

-- Note: It assumes the same code works fine in Chrome, Firefox, Safari

Edit: Context

I'm building a facebook page tab plugin with AngularJS + Google App Engine Python.

I use a dozen custom directives either written by me or by the angular-ui team and 4-5 controllers.

Everything works fine in Chrome, Safari and Firefox, but not in IE8.

Answer 1

The problem is that IE8 does not recognize "custom" elements.

Use "replace:true" in your directives declaration that are in element form (restrict: 'E') and use IE shiv (I used angular-ui's IE shiv and declared my custom tags there).

See more on the links below: https://github.com/angular/angular.js/issues/1933 http://angular-ui.github.com/#ieshiv

Answer 2

If you are using jQuery the problem can be solved by modifying the jQuery file. Add your custom elements to the list of "nodeNames":

var nodeNames = "abbr|article|aside|audio|bdi|canvas|data|datalist|details|figcaption|figure|footer|" +
    "header|hgroup|mark|meter|nav|output|progress|section|summary|time|video|accordion|accordion-group|accordion-heading",

More information ca be found on http://blog-it.hypoport.de/2013/08/24/how-to-make-your-angularjs-app-work-in-ie-8/