javascript - Angular UI 路由器子状态不适用于 IE-6ren

javascript - Angular UI 路由器子状态不适用于 IE

转载作者：行者123 更新时间：2023-12-03 05:04:09

24

4

正如我在 my other question 中所说，我正在使用 NodeJS、Express 和 Angular-UI-Router 在 AngularJS 中创建一个 Web 应用程序。

起初我根本无法加载页面(我设法解决了这个问题)，现在的问题是 Angular-UI-Router 似乎无法进入嵌套状态。

请注意，这只是 Internet Explorer 上的问题。该网站在 Chrome 和 Firefox 上完美运行。我使用的是 Internet Explorer 11。

“常规”状态工作正常，但我无法访问嵌套状态(但它不会抛出任何错误)

可能是因为我使用了 HTML5 无哈希 URL？

这是我的索引:

<!DOCTYPE html>
<html>
    <head>
        <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
        <!-- Angular Material CSS now available via Google CDN; version 1.0.7 used here -->
        <link rel="stylesheet" href="./modules/angular-material/angular-material.min.css"/>
        <link rel="stylesheet" href="./css/style.css"/>
        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/>
    <link rel="icon" href="icons/favicon.ico" type="image/x-icon"/>
        <base href="/"/>
        <title>Area Clienti</title>
        <script src="./modules/angular/angular.js" type="text/javascript"></script>

        <script src="./modules/ngstorage/ngStorage.js" type="text/javascript"></script>

        <script src="./modules/angular-aria/angular-aria.min.js" type="text/javascript"></script>
        <script src="./modules/angular-animate/angular-animate.min.js" type="text/javascript"></script>

        <script src="./modules/angular-material/angular-material.min.js" type="text/javascript"></script>

        <script src="./modules/angular-ui-router/release/angular-ui-router.min.js" type="text/javascript"></script>
        <script src="./modules/ui-router-extras/release/modular/ct-ui-router-extras.core.min.js" type="text/javascript"></script>
        <script src="./modules/ui-router-extras/release/modular/ct-ui-router-extras.dsr.min.js" type="text/javascript"></script>
        <script src="./modules/ui-router-extras/release/modular/ct-ui-router-extras.sticky.min.js" type="text/javascript"></script>

        <script src="./modules/pdfmake/build/pdfmake.min.js" type="text/javascript"></script>
        <script src="./modules/pdfmake/build/vfs_fonts.js" type="text/javascript"></script>

        <script src="./modules/angular-messages/angular-messages.min.js" type="text/javascript"></script>
        <script src="http://ngmaterial.assets.s3.amazonaws.com/svg-assets-cache.js" type="text/javascript"></script>

        <script src="./js/client.js" type="text/javascript"></script>
    </head>
    <body ng-app="App" ng-controller="AppCtrl" ng-view ui-view ng-cloak layout="row">
    </body>
</html>

这是 ui-router 状态的 js 配置:

app.config(function($locationProvider, $mdThemingProvider, $mdIconProvider,$stateProvider, $urlRouterProvider, $stickyStateProvider) {
        $locationProvider.html5Mode(true);

        $mdThemingProvider
            .theme('default')
            .primaryPalette('blue')
            .accentPalette('light-blue');

        $urlRouterProvider.otherwise('/login');

        //$stickyStateProvider.enableDebug(true);

        $stateProvider
            .state('login', {
                url: '/login',
                templateUrl: 'views/login.html',
                controller:'loginController',
                authenticate: false
            })
            .state('dashboard', {
                url: '/',
                templateUrl: 'views/dashboard.html',
                controller:'dashboardController',
                authenticate: true,
                sticky:true,
                dsr:true
            })
            .state('dashboard.rating', {
                url:'rating',
                templateUrl: 'views/rating.html',
                controller: 'ratingController',
                authenticate: true,
                abstract:true
            })
            .state('dashboard.rating.search', {
                url:'/search',
                views: {
                    'top': {
                        templateUrl: 'views/rating-search.html'
                    },
                    'content':{
                        templateUrl:'views/rating-search-result.html'
                    }
                },
                authenticate: true
            })
            .state('dashboard.rating.view', {
                url:'/view',
                views: {
                    'top': {
                        template: ''
                    },
                    'content':{
                        templateUrl:'views/rating-view.html'
                    }
                },
                authenticate: true
            })
            .state('dashboard.infocamere', {
                url:'infocamere',
                templateUrl: 'views/in-costruzione.html',
                authenticate: true
            })
            .state('dashboard.pratiche', {
                url:'pratiche',
                templateUrl: 'views/in-costruzione.html',
                authenticate: true
            });
    })

最佳答案

将其添加到元标记中

 <meta http-equiv="X-UA-Compatible" content="IE=edge">

这可以认为相当于 HTML5 doc-type，它要求浏览器以 IE 11 到 IE 6 最受支持的模式在文档中运行 Edge 是 IE 中最受支持的文档模式

有关此内容的更多信息可以阅读此主题 https://github.com/google/web-starter-kit/issues/728

关于javascript - Angular UI 路由器子状态不适用于 IE，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42084330/

24

4

0

文章推荐： JavaScript ADODBE 连接更新查询不起作用

文章推荐： javascript - 如何点击网页上没有id的按钮？

文章推荐： javascript - 需要使用 mongoose 更新对象内的值

Angular2 路由器 VS ui-router-ng2 VS ngrx 路由器
使用 ui-router-ng2 有哪些优点和缺点？而不是新的 Angular2 路由器？过去我使用 ui-router 和 Angular 1.x 而不是使用 ngRoute，因为我需要更好地支持嵌
【路由器】小米WR30U解锁并刷机
本文主要记录个人对小米 WR30U 路由器的解锁和刷机过程，整体步骤与一般安装流程类似，但是由于 WR30U 的解锁 ssh 和刷机的过程中有一些细节需要注意，因此记录一下解锁
具有可选查询参数的 Angular 路由器
我有路由器 { path: 'reset-password', component: ResetPasswordComponent, } 我希望能够将其作为直接链接 (/reset-passw
javascript - Backbone 路由器
所以，我试图制作一个具有 Backbone 的示例应用程序，但我无法使路由器工作，对此有什么想法吗？谢谢。这是我的路由器 var Workspace = Backbone.Router.extend(
java - 路由器/经销商代理不传送消息
我正在研究分布式应用程序。网络基于ZMQ(jeromq)，这是我的架构: N Clients (Dealer socket) (Router) Proxy (Dealer) 1 (Dealer)
AngularJS 路由器 - 第二次不起作用
In this plunk我有一个 ui-router $state.goto这仅在第一次有效，即使我增加了 seq变量以强制重新加载。看到时间戳没有改变。这段代码有什么问题？ HTML G
Angular 路由器、面包屑组件测试
我有面包屑组件，测试如下。测试应覆盖75%以上。测试失败，因为 ActivatedRoute.root.children 未定义。谁知道我该如何定义它？我需要至少一个 children 作为 root
具有站点迁移功能的 Angular2 路由器
我正在使用 RC5 和 "@angular/router": "3.0.0-rc.1" 我似乎无法捕捉到旧路线(示例): /category/subcategory/subcategory/artic
Angular2 路由器 - 辅助路由
我确实有一个延迟加载模块，当我转到 /lazy 时默认加载 LazyLoadedComponent。到目前为止，没问题。此组件包含 2 个路由器 socket : 模块有以下路由: const
Angular2 路由器 - 使用不同的参数导航到当前页面
我试图用不同的参数路由到当前页面，但没有成功。我有一个触发的组合框: this.router.navigate(['page', selectedId]); Url 正在更改，仅此而已。如何使用不同
reactjs - react 路由器。刷新页面或手动写入url时无法获取
我正在尝试使用 React 路由器构建 SPA。当我使用链接导航时，它工作得很好，但是刷新或写入 url 时，它给我 cannot GET/(any route except main)。我试图将 h
javascript - 如何在嵌套路由中添加样式 react 路由器
我无法在我的 app.js 文件中添加样式。 div 在路线内不起作用。有没有其他方法可以在路由中添加样式？ : } /> } /> }> } />
reactjs - 基于角色的 react 路由器
根据用户角色在 react-router 中有条件地呈现路由的最佳方法是什么。我有一个案例，并非所有角色都有权查看某些路线。而且我还需要处理子路线。因此，如果主要路线之一类似于/posts，我只希望
flash - RTMFP 和防火墙/路由器
我想使用 Flash 的 RTMFP 对等协议(protocol)，但我想知道它是否值得为主流受众开发？据我了解，它使用 UDP，除非用户的防火墙/路由器配置正确，否则它变得毫无用处。这个问题有解决
collections - 路由器 waitOn 等待每次渲染的订阅
我有一 strip 有 waitOn 的路线返回 Meteor.subscribe 的钩子(Hook).每次触发路线时，我都会从我的 loadingTemplate 中看到微调器在看到实际数据之前简要
reactjs - react 路由器:MemoryHistory
所以我最近开始尝试使用 createMemoryHistory，因为我正在构建一个将在 iframe 中呈现的应用程序。幸运的是，单击 UI 按钮，我可以在不修改 url 的情况下四处导航。但是，当我
javascript - 基本名称无法连接 react 路由器
我在我的 React redux 应用程序中使用 connected-react-router。我需要服务器端渲染和客户端渲染(我通过 limenius react bundle 在 symfony
ios - 路由器 VS 协调器
我是一名 ios 开发人员，并试图找出 viper 架构中的路由器和 coordinator 之间的区别。我真的找不到明确的答案是协调器只是被认为是一种模式，所以路由器毕竟只是某种协调器还是它们有不
angularjs - UI 路由器 - 检查状态是否存在
我想要这样的东西: if ($state.get("^")) $state.go("^"); else $location.path('/'); 但它显然不起作用(即使没有父状态，它也总是与 $sta
reactjs - 自定义历史记录不起作用的 react 路由器
当我从 react-router-dom 使用 BrowserRouter 时，我的路由正在工作。但是为了使用自定义历史记录，我用来自 react-router 的 Router 替换了 Browse

首页

博学

6Ren·AI

商城

javascript - Angular UI 路由器子状态不适用于 IE