Question

这是我的错误：

core.es5.js:1020 ERROR Error: Uncaught (in promise): 
Error: Cannot match any routes. URL Segment: 'home'

这是view.html中的代码：

<div class="container">
  This is the main app;
  <a routerLink="second">Click to go to second</a>
  <a routerLink="third">Click to go to third</a>
  <a routerLink="app">Go to Home</a>
  <router-outlet></router-outlet>
</div>

这是我的对象数组，包括主页和其他路径的路径。回家的路径是正确的，因此我不明白为什么每次点击它时都会弹出错误。

const appRoutes: Routes=[
  {path:'second', component:SecondComponent},
  {path:'third', component:ThirdComponent},
  {path:'', redirectTo:'./app', pathMatch:'full'},
]

当我点击第三个和第二个组件网址时，一切正常。

注意：我想在点击主页组件时隐藏第二个和第三个组件。

Answer 1

您需要定义家庭路线：

const appRoutes: Routes=[
  {path:'home', component:HomeComponent},
  {path:'second', component:SecondComponent},
  {path:'third', component:ThirdComponent},
  {path:'', redirectTo:'/home', pathMatch:'full'},
  {path:'**', redirectTo:'/home', pathMatch:'full'}
];

Answer 2

这解决了我的问题，我的主路径是空的，因此一旦我点击主页标签，主页就不会重复。

const APP_ROUTES: Routes=[
  {path:'first', component:FirstComponent},
  {path:'second', component:SecondComponent},
  {path:'third', component:ThirdComponent},
  {path:'', redirectTo:'', pathMatch:'full'},
];

角度重新路由到主页不起作用？

2 个答案: