Question

我正在使用angular-ui-router库，我遇到了URL问题。

我有以下代码：

app.js：

app.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
    .state('state', {
        url: '/state',
        templateUrl: 'templates/state.html',
        onEnter: function () {
            /*... code ...*/
        }
    })});

的index.html：

<a href="#/state">STATE</a>

这样做有效，但当我从<a>标记中删除“＃”时，这不起作用。

如何从网址中删除“＃”符号？

Answer 1

如果您想要没有哈希标记的导航，则需要启用HTML5Mode：

app.config(["$locationProvider", function($locationProvider) {
  $locationProvider.html5Mode(true);
}]);

您还需要通过将以下代码添加到HTML文件的<head>来告知angular应用程序的根URL：

<base href="/">

请注意，对HTML5模式的支持取决于浏览器。对于那些不支持历史记录API的人，Angular will fallback to hashbang。

Answer 2

如果您使用 Angular 1.6 + ，则还需要从网址中删除hashPrefix：

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix(''); // by default '!'
  $locationProvider.html5Mode(true);
}]);

不要忘记更改基数：

<head>
    ...
    <base href="/">
</head>

Answer 3

grid

在index.php或index.html中的＆lt;头＆gt;标签插入

    yourApp.config(function ($stateProvider, $urlRouterProvider,$locationProvider) {

    $urlRouterProvider.otherwise('/home');

    //add this line in your routing code   
    $locationProvider.html5Mode(true);

    $stateProvider.state('web.home', {
                url: '/home',
                templateUrl: 'pages/home.html',
                controller: 'mainController'         
            })
    }

CodeIgniter ：

< base href="/" >

如何删除angular-ui-router URL中的“＃”符号

3 个答案: