Currently, I am attempting to utilize the angular router in order to navigate from one page to another.
Within my page, there is a button that, upon clicking, should direct me to a different page.
At this moment, my URL reads as:
http://localhost:4200/user/12345567Below is the code snippet for my button:
leaveArea(){
this.router.navigate([ 'account', 'dashboard'], {relativeTo: this.route});
}
The desired destination is
http://localhost:4200/account/dashboardHowever, instead of landing at
http://localhost:4200/account/dashboardhttp://localhost:4200. Interestingly, there is a split-second glimpse of http://localhost:4200/account/dashboardEdit
To provide further insight, I have included the routeTrace results below:
https://i.stack.imgur.com/hYMXc.png https://i.stack.imgur.com/rXiK4.png https://i.stack.imgur.com/J3sTO.png
Edit
Here, you will find my routing file details:
const appRoutes: Routes = [
{ path: "", component: HomeComponent },
{ path: "account/dashboard", component: AccountDashboardComponent},
{
path: "user/:id", component: UserComponent
}
];
@NgModule({
imports: [RouterModule.forRoot(appRoutes, { enableTracing: true })],
exports: [RouterModule]
})
export class AppRoutingModule {}