Angular：一些路线使用 PathLocationStrategy 但其他一些路线使用 HashLocationStrategy答案

【问题标题】：Angular: Some routes use PathLocationStrategy but some other routes use HashLocationStrategyAngular：一些路线使用 PathLocationStrategy 但其他一些路线使用 HashLocationStrategy
【发布时间】：2018-01-12 14:14:24
【问题描述】：

我的 app.routes 中有 4 条路线。

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

export const pageRoutes: Routes = [
  {path: '', redirectTo: 'home', pathMatch: 'full'},
  {path: 'home', component: HomeComponent},
  {path: 'transaction', loadChildren: './app/transaction.module#TransactionModule'},
  {path: 'evidence', loadChildren: './app/evidence.module#EvidenceModule'}
];

@NgModule({
  imports: [RouterModule.forRoot(pageRoutes)],
  exports: [RouterModule],
})
export class AppRoutingModule {}

在 app.routes 中，我没有对 LocationStrategy 进行任何特定设置。因为对于transaction 路由，我想使用angular2 默认的PathLocationStrategy，它不允许用户刷新页面。

但是对于evidence 路由，我实际上希望用户能够刷新页面。所以我想在这里使用 HashLocationStrategy 。

这是evidence-routing.module

    @NgModule({

          imports: [RouterModule.forChild([
            {path:':sessionId', component: EvidenceComponent}
            { path: '**', redirectTo: '/404' },
            { path: '404', component: PageNotFoundComponent}
          ])], 
          exports: [RouterModule],
          providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}]

    })
    export class EvidenceRoutingModule {}

我想在 evidence-routing.module 中添加 providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }] 以启用 HashLocationStrategy 并且仅适用于该路由。

但是一旦我把它放在那里，整个应用程序将采用 HashLocationStrategy，它也适用于事务路由。

我找不到任何好的解决方案来处理这个问题。

对这个问题有什么建议吗？

非常感谢！

【问题讨论】：

标签： angular angular2-routing angular2-services angular-routing angular-router

【解决方案1】：

您不能为不同的路由使用不同的LocationStrategy，此设置适用于Router，而不适用于路由，并且一个应用程序只能有一个路由器。

您应该确保服务器配置正确，然后重新加载将适用于所有路由，即使使用PathLocationStrategy。

确保您的服务器配置为支持 HTML5 pushState。
这只是意味着对于未知资源的请求，服务器返回index.html。

【讨论】：