Internet Explorer 9 无法解析 Angular UI-Router答案

【问题标题】：Angular UI-Router Not Resolving with Internet Explorer 9Internet Explorer 9 无法解析 Angular UI-Router
【发布时间】：2015-05-21 17:15:55
【问题描述】：

我有一个 Angular v1.3 应用程序，它使用 Angular ui-router v0.2.13 进行所有路由。该网站适用于所有浏览器，包括 IE 10 和 IE 11，但不是 IE 9（我们决定不使用 IE8，我知道 v1.3 不支持它）。尽管我尽了最大的努力，IE 9 仍不断地解析到我的 $stateProvider's otherwise 路由（设置为 /*path，这可能是罪魁祸首，因此我出于测试目的禁用了该路由）。

为了获得任何其他路由来解决，我尝试设置$locationProvider.html5Mode(false)，修改$locationProvider.hashPrefix，将<base href="/" />更改为各种URL，包括<base href="/#!"/>，我什至将xmlns:ng="http://angularjs.org" 包含在<html> 标记中，以作为衡量标准。无论我尝试什么，IE 9 都会不断尝试解析我的otherwise 路由，或者如果该路由被禁用，则什么也不会。顺便说一句，我的主页路由 URL 设置为/。

随着发布截止日期的临近，我一直在关注我的代码，所以我会第一个承认我可能会忽略一些明显的东西。谁能提供任何其他提示或技巧以使 ui-router 在 IE 9 中正确解析？

【问题讨论】：

标签： angularjs internet-explorer-9 angular-ui-router

【解决方案1】：

我们使用类似下面的东西：

<!DOCTYPE html>
  <html lang="fr" xmlns="http://www.w3.org/1999/xhtml" ng-csp xml:lang="fr-CA">

//...
var app = angular.module('YourApp', [...]);
angular.bootstrap(document, ['YourApp'], {strictDi: true})

//...
    angular.module('YourApp').config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
  function ($stateProvider, $urlRouterProvider, $locationProvider) {
    $locationProvider.html5Mode(false);
    $locationProvider.hashPrefix('!');

    $urlRouterProvider.otherwise('/');

    $stateProvider
      .state('home', {
        url: '/',
        cache: false,
        controller: 'HomeController as vm'
      })
      .state('anon', {
        url: '/info',
        controller: 'AnonController as vm'
      })

//等等...

【讨论】：

【解决方案2】：

对我来说，IE9 为哈希 URL 正确路由 /#/example，但访问 / 将解析到其他路由。我通过使用一个函数来解决这个问题，并检查其中的 url。

$urlRouterProvider.otherwise(function($injector){
    var state = $injector.get('$state');
    var location = $injector.get('$location');
    if (!location.url()) {
        // handle HTML5 fallback / IE9 when url has no hash
        return state.go('home');
    }
    state.go('404');
});

【讨论】：