angular-ui-router – IE8 and nested states

Just a quick tip, If you still have to maintain compatibility with IE8 (< AngularJS 1.3) – and you’re using angular-ui-router for nested views, the documentation for nesting states says you should use “<ui-view />” for your template for an abstract parent state:

Remember: Abstract states still need their own <ui-view/> for their children to plug into. So if you are using an abstract state just to prepend a url, set resolves/data, or run an onEnter/Exit function, then you’ll additionally need to set template: "<ui-view/>".

 

The problem is, IE8 doesn’t like “<ui-view />” – so instead, (I’d suggest this anyways), use:

 

 

2 Comments
  1. Blaise Liu says:

    Is it supposed to be ng-view or ui-view?

    Reply
    • Actually either or; if you’re using vanilla AngularJS routing it would be ng-view, if you use Angular UI-Router, it would be ui-view.

      The issue is with the custom elements, e.g.: <div ui-view=''> works, whereas does not with IE8.

Leave a Reply




XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">