角度路由中的哈希符号

Hash sign in Angular Routing

本文关键字:哈希 符号 路由      更新时间:2024-06-30

我在角度路由中遇到#符号问题。我有导航链接应该没有前导斜杠,比如:

<li class="active"><a href="/"><i class="fa fa-home" aria-hidden="true"></i></a></li>
<li><a href="#services"> УСЛУГИ</a></li>

否则,scrollspy不起作用(如果我使用的是<a href="#/services">
但现在有一个角度路由的问题,它是这样配置的:

config(["$routeProvider", function ($routeProvider) {
        $routeProvider
            .when('/', {
                templateUrl: '/templates/home.html',
                controller: 'smu72Controller'
            })
            .when('/objects', {
                templateUrl: '/templates/objects.html',
                controller: 'smu72Controller'
            })
            .when('/object/:Id', {
                templateUrl: '/templates/object.html',
                controller: 'smu72Controller'
            })
        .otherwise({
            redirectTo: "/"
        });

我应该如何更改路由(或scrollspy)配置,以便能够将这些导航链接用于两个目的——滚动路由和角度路由?

您可以使用$locationProvider模块来摆脱#登录路由

config(["$routeProvider", "$locationProvider", function ($routeProvider, $locationProvider) {
    $routeProvider
        .when('/', {
            templateUrl: '/templates/home.html',
            controller: 'smu72Controller'
        })
        .when('/objects', {
            templateUrl: '/templates/objects.html',
            controller: 'smu72Controller'
        })
        .when('/object/:Id', {
            templateUrl: '/templates/object.html',
            controller: 'smu72Controller'
        })
        .otherwise({
            redirectTo: "/"
        });
        // use the HTML5 History API
        $locationProvider.html5Mode(true);
}]);