router-outlet name showing on url. How to remove this I found the same question on StackOverflow here is the link but there no answer was given. so I posted this again. In my project URL showing like : http://localhost:4200/dashboard/(dashboardSection:profile)
but I want to make it like:
http://localhost:4200/dashboard/profile
http://localhost:4200/dashboard/list
I have provided all the code for routing.
app.module.ts
const appRoutes: Routes = [
{ path: 'home', component: HomeComponent},
{ path: 'sign-up', component: SignUpComponent, canActivate: [PreventLoggedInAccess] },
{ path: 'file', component: FileUploadComponent, canActivate: [AuthGuard] },
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard],
children:[
{
path: "list",
component: ListingListComponent,
outlet: 'dashboardSection'
},
{
path: "profile",
component: ProfileEditComponent,
outlet: 'dashboardSection'
}
]
},
{ path: '',
redirectTo: 'home',
pathMatch: 'full'
},
{ path: '**', component: PageNotFoundComponent }
];
on Import section @NgModule({});
RouterModule.forRoot(
appRoutes,
{ enableTracing: false } // <-- debugging purposes only
),
dashboard.component.html
<li [routerLink]="['/dashboard',{ outlets: { dashboardSection: ['list'] }}]" routerLinkActive="active">List</li>
<li [routerLink]="['/dashboard',{ outlets: { dashboardSection: ['profile'] } }]" routerLinkActive="active">profile</li>