I am setting up my first AngularJS app, and having a problem with links in IE8 using hashbang in html5Mode. There's one main view with data specific to a date range, with links to other date ranges within the page. I set it up as follows:
- html5Mode is on
- I'm using ng-href to get each link from a function
- the root of the app is not at site root
- I have a
<base>tag on the page for the app root (<base href="/my/app/"/>)
The page is working fine on first load in modern browsers and IE8 (necessary, sorry), and IE8's URL is transformed from "/my/app/my/first/page" to "/my/app/#/my/first/page as expected. The problem is that links aren't behaving consistently between the old and new browsers.
If I start from "my/first/page" and create a link to "my/next/page", it looks and behaves great on modern browsers, but IE8 goes to "/my/app/#/my/first/page/my/next/page as if Angular isn't treating it as an in-app link. It just appends the link to the current address.
If I create the link as "/my/next/page" with the leading slash, IE8 does work fine but the modern browsers are treating it as absolute and outside of the app, which is expected but not desired.
If I use a valid absolute link ("/my/app/my/next/page"), IE8 goes to "/my/app/#/my/app/my/next/page".
I can work around it by changing the location in an ng-click, but I'd prefer the links to look and behave like normal links for opening in separate tabs, etc.
Update
After working on this awhile longer, I think it might be related to an issue IE has with the <base> tag. Some articles have suggested using the FQDN in the base or using javascript to fix it, but neither of those have had an effect.
