【问题标题】:How do I get rid of the /#/ when using ui-router? [duplicate]使用ui-router时如何摆脱/#/? [复制]
【发布时间】:2014-08-31 22:41:51
【问题描述】:

我是 Angular 的新手,我目前正在使用 ui.router 进行路由,并且对某些事情感到好奇。我注意到当我在 localhost 或在线访问我的网站时,我的 URL 末尾包含 /#/。首页看起来像 domain.com/#/ 和其他页面跟随套件( domain.com/#/about )我如何让它看起来没有哈希?

这是我的 app.js 的一个示例

var app = angular.module('dashboardApp', ['ui.router']);

app.config(
    ['$stateProvider','$urlRouterProvider', 
    function($stateProvider, $urlRouterProvider){
    $urlRouterProvider.otherwise('/');

    $stateProvider
        //Dashboard states and nested views ========================
        .state('home', {
            url: '/',
            templateUrl: './templates/main/dashboard.html',
            controller: 'dashboardCtrl'
        })

        //Subject states and nested views ==========================
        .state('about', {
            url: '/about',
            templateUrl: './templates/main/about.html',
            controller: 'aboutCtrl'
        });
    }]);

这就是我在 DOM 中的调用方式

<div class="main-nav">
    <a ui-sref="home"><img src="randomimage.png" /></a>
</div>
<div class="main-nav">
    <a ui-sref="about">About</a>
</div>

【问题讨论】:

  • 设置它:$locationProvider.html5Mode(true);

标签: javascript angularjs routes angular-ui-router


【解决方案1】:

hasbang 是出于与旧浏览器的兼容性原因。 这是同一问题的主题:

AngularJS routing without the hash '#'

这是一篇博客文章,解释了如何安全地摆脱 hashbang 并为旧版浏览器提供回退:

http://scotch.io/quick-tips/js/angular/pretty-urls-in-angularjs-removing-the-hashtag

基本上,您可以使用$locationProvider.html5Mode(true) 来消除“HTML5 就绪”浏览器的 hashbang,Angular 将自动回退到旧浏览器的 hashbang 版本。

【讨论】:

  • 看起来应该有帮助。我使用 ng-include 从 index.html 上的单独文件中引入导航项是否重要?
  • 不,应该没什么区别。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-03-02
  • 2022-01-04
相关资源
最近更新 更多