How to deal with child routes that has child?

How to deal with child routes that has child?

Problem is when i try to reload the browser when its on /:temId route, it goes back to :/temp routes, but address bar has the /:temId route.

what should i do? thank you.

this the app routes,

export const routes: Routes = [
{
path: '',
component: LayoutComponent,
canActivate: [AuthGuard],
children: [
{
path: path.ME,
component: MEComponent,
loadChildren: () =>
import(
'./features/pages/me/me.routes'
).then((m) => m.MEroutes),
data: { breadcrumb: 'ME' },
},
]
}
];


the ME routes,

export const MEroutes: Routes = [
{
path: path.TEMP,
component: TempComponent,
loadChildren: () =>
import('./components/temp/temp.routes').then((m) => m.TempRoutes),
},
];


and the Temp routes,

export const TempRoutes: Routes = [
{
path: '',
loadComponent: () =>
import('./components/temp-list/temp-list.component').then(
(m) => m.TempListComponent
),
data: { breadcrumb: 'Temp' },
children: [
{
path: `:tempId`,
loadComponent: () =>
import('./components/temp-detail/temp-detail.component').then(
(m) => m.TempDetailComponent
),
},
],
},
];

Continue reading...