Url is changing like expected in while clicking but that particular route is not getting loaded. Please find the below code for reference.
HTML
<a
mat-tab-link
*ngFor="let routeLink of routeLinks; let i = index"
[routerLink]="routeLink.link"
[routerLinkActive]="'mat-tab-link-active'"
#rla="routerLinkActive"
class="mat-tab-link"
>
{{ routeLink.label }}
</a>
TS
const path = `/site/`;
this.routeLinks = [
{
key: 'network',
link: path + 'network'
},
{
key: 'subnets',
link: path + 'subnets'
}
];
My component has multiple router-outlet in the parent component. The code snippet I shared is the child component so, the router is not working as expected. Finally, I understood the root cause I added the outlet to the router-outlet like below in the parent component resolves my issue. HTML
<router-outlet name="dashboard-outlet"></router-outlet>
Routing TS
const routes: Routes = [{ path: '', component: ComponentName, outlet: 'dashboard-outlet' }];