Angular 重新加载页面时，角度始终重新定向到默认路径

我一直在使用Angular开发一个新的应用程序，在重新加载时，应用程序总是加载默认路径

以下是我在应用程序模块中的路由数组

const routes: Route[] =[
  {
    path: "products",
    loadChildren: "./products/products.module#ProductsModule"
  }
  ,{
    path: "books",
    loadChildren: "./books/books.module#BooksModule"
  }
  ,{
    path: "clocks",
    loadChildren: "./clocks/clocks.module#ClocksModule"
  }
  ,{
    path: "",
    redirectTo: "products",
    pathMatch: "full"
  }
];

我的三个模块是产品、书籍和钟表

第一次加载应用程序时，我们的URL是localhost:4200/products。（如预期的那样）。然后我使用导航栏导航到localhost:4200/products

<ul class="nav nav-pills mt-5">
  <li class="nav-item">
    <a class="nav-link" routerLink="products" routerLinkActive="active">Products</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" routerLink="books" routerLinkActive="active">Books</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" routerLink="clocks" routerLinkActive="active">Clocks</a>
  </li>
</ul>

产品


书


时钟

单击从路径localhost:4200/books重新加载时，它始终加载localhost:4200/products，即默认URL。但是我们知道必须加载URL localhost:4200/books

我已经通过各种角度的链接和角度IO网站，但我不能想出这一个

非常感谢您的帮助。

您可以尝试：

<ul class="nav nav-pills mt-5">
  <li class="nav-item">
    <a class="nav-link" routerLink="/products" routerLinkActive="active">Products</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" routerLink="/books" routerLinkActive="active">Books</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" routerLink="/clocks" routerLinkActive="active">Clocks</a>
  </li>
</ul>

产品


书


时钟

我相信问题来自您的链接。水花不见了

试着这样做：

书籍

您为routerLink提供的输入不正确！试试这个

<ul class="nav nav-pills mt-5">
  <li class="nav-item">
    <a class="nav-link" [routerLink]="['/products']" routerLinkActive="active">Products</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" [routerLink]="['/books']" routerLinkActive="active">Books</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" [routerLink]="['/clocks']" routerLinkActive="active">Clocks</a>
  </li>
</ul>

产品


书


时钟

---

这应该行得通。

感谢您的宝贵意见和反馈。 我在问题中提供的路线和链接运行良好

我犯的错误是在我加载的第一个组件的ngOnInit（）中添加了this.router.navigateByUrl（）。这导致了这个问题

---

再次感谢大家的投入。

通常对于默认路径，使用通配符，如

{path:'**'，重定向到：'products'}

。这表示，“如果没有匹配的补丁，请转到“产品”。