Le réacheminement angulaire vers la page d'accueil ne fonctionne pas?

Question

Voici mon erreur:

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

Ceci est le code de l'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> 

Et voici mon tableau d'objets qui comprend le chemin vers les chemins de la maison et d'autres. Le chemin vers la maison est correct, donc je ne vois pas pourquoi l'erreur apparaît à chaque fois que je clique dessus.

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

Lorsque je clique sur l'URL du troisième et deuxième composant, tout fonctionne correctement.

REMARQUE: Je souhaite masquer les deuxième et troisième composants lorsque je clique sur le composant principal.

Answer 1

Cela résout mon problème, mon chemin de la maison est vide et à cet effet la page d'accueil ne se fasse pas double emploi une fois que je clique sur l'étiquette de la maison.

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

Answer 2

Vous devez définir l'itinéraire d'accueil:

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'} 
];