javascript - Angular 组件路由器从 URL 中删除 #

Question

我正在使用 Angular 1.5 通过 Angular New Router 进行路由。我遇到了从 URL 中删除 # 以使它们 SEO 友好的问题。组件文件夹中有 2 个 View ，即第一个 View 和第二个 View ，它们是 Angular 路由器的一部分，然后是第三个 View Navigation.html，它不是 Angular 路由的一部分，而是一个单独的 HTML。这些 View 的链接在页面标题处给出。前 2 个是 Angular View ，第三个是 Navigation.html(不是 Angular 路由的一部分)。我已使用 $locationProvider.html5Mode(true) 成功从 URL 中删除了 # 标记。但执行此操作后，它无法导航到 Navigation.html，而是将其重定向到 First.html。这是一个非常简单的代码，使用了 Bootstrap、Grunt 和 Angular。我已经把它推到GitHub了。任何人都可以通过克隆看到这一点。我将非常感谢你。如果有更好的方法也请建议我。

https://github.com/kjanshair/Angular-New-Router-Example

我想要的只是从 URL 中删除 # 并能够导航到 Navigation.html。

Answer 1

您需要做的就是将 $locationProvider 添加到您的配置函数中并在其中调用: $locationProvider.html5Mode(true);

angular.module('myapp',[]).
    config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
        $routeProvider.when().otherwise() # define routing
        $locationProvider.html5Mode(true);
    }]);