为什么 Angular routerLink（没有前导斜杠）在导航回空路径时被破坏？

Question

让我们以这个基本的导航树为例：

• 基本的
  • 次要的
    • 深的

看看我的Stackblitz 项目。

我的路线是

const routes: Routes = [
  {
    path: "",
    component: PageParentComponent,
    children: [
      {
        path: "",
        component: PageChildPrimaryComponent
      },
      {
        path: "secondary",
        component: PageChildSecondaryComponent
      },
      {
        path: "secondary/deep",
        component: PageDeepComponent
      }
    ]
  }
];

使用<a routerLink=".."> ，我可以成功导航上一层，并使用<a routerLink="../..">两层。 但是，当我使用双点从任何更深的页面返回“主”页面时，任何不以斜杠开头的routerLink都会搞砸； URL 的根部分（ https://angular-ukxb4a.stackblitz.io/或localhost:4200/ ，在本地运行时）替换为%28 。 当我使用<a routerLink="/"> （斜线而不是双点）时，一切都很好。

为什么会这样？

Answer 1

你要去的网址是

https://angular-ukxb4a.stackblitz.io/secondary

不是

https://%28secondary%29/

起始斜杠将路径附加到您现有的路径。 我希望这能帮到您。