Internet Explorer 9 无法解析 Angular UI-Router
Posted
技术标签:
【中文标题】Internet Explorer 9 无法解析 Angular UI-Router【英文标题】：Angular UI-Router Not Resolving with Internet Explorer 9 【发布时间】：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 中正确解析？
【问题讨论】：
【参考方案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');
);
【讨论】：
以上是关于Internet Explorer 9 无法解析 Angular UI-Router的主要内容，如果未能解决你的问题，请参考以下文章
无法在 localhost (WAMP) 上的 Internet Explorer 中加载 jQuery
强制 Internet Explorer 9 使用 IE 9 模式
Internet Explorer 9 - 按比例调整图像大小