I have a nav component with a sub nav associated to it. The data structure is as follows:
{
title: 'Layout', routerLink: 'layout', // main nav
subNav: // sub nav
{
title: 'Layout',
items: [
{ title: 'Layout', routerLink: 'layout' },
{ title: 'Page Layout', routerLink: 'page-layout' },
]
}
}
I would like to create a link between the main nav and the sub nav so that when page-layout is navigated to, the active class is still set. My current parent HTML is:
<div [routerLink]="[item.routerLink]"
[routerLinkActive]="['active']"
[routerLinkActiveOptions]="{ exact: true }" #navitem>
// navigation specific html
</div>
I have attempted to add multiple routerlinks options and provide an array of routerlink options such as
[routerLink]="['/layout', '/page-layout']"
but this doesn't work.
Thanks