Question

我有以下基本路线：

const appRoutes: Routes = [
  {
    path: 'login',
    component: LoginComponent
  },
  {
    path: '',
    component: WidgetComponent
  },
  {
    path: 'P3',
    component: DashboardComponent
  },
  {
    path: 'NN',
    component: DashboardComponent
  },
  {
      path: '**',
      redirectTo: ''
  }
];

，效果很好。当我导航到.../p3时，它会加载我的组件。

现在，加载的网址不仅仅是上面的这个网址。但类似这样：

localhost:4200/P3?p1=hello&p2=world

但是它在serve中仍然可以正常工作。

构建并发布应用程序时，我遇到了以下问题：通过直接导航至localhost:4200/P3?p1=hello&p2=world，服务器响应为This page cannot be found on the server，而我设法理解为P3问题。因此，我在模块中添加了HashLocationStrategy：

{ provide: LocationStrategy, useClass: HashLocationStrategy }，

所以现在我的网址是：

<server>/#/P3?p1=hello&p2=world

这解决了我的问题。

我的问题是：有更好的方法吗？我在想，是否可以在网址中仅隐藏P3？我在文档中看到有 skipLocationChange: true设置为路线的NavigationExtras，但我不满意。

有人有主意吗？

Answer 1

最可接受的默认位置策略PathLocationStrategy。这是Angular中的default strategy，并利用了名为HTML5的新pushstate API（来自HTML5历史API）。在网址中添加#不会产生太大的干扰。因此，请避免使用HashLocationStrategy。

如果您对此有疑问，则可能没有添加基本href。只需检查head的{{1}}部分

index.html

使用隐藏路径进行路由

1 个答案: