При использовании routerLink
и routerLinkActive
для применения CSS к панели навигации я хотел бы также включить информацию fragment
, чтобы ссылки были уникальными для разделов на домашней странице.
Я пробовал использовать [routerLinkActiveOptions]="{ exact: true }"
без какой-либо удачи.
Соответствующая часть кода навигационной панели:
<li routerLinkActive="active"
[routerLinkActiveOptions]="{ exact: true }">
<a routerLink="/sitio" fragment="inicio">Inicio</a>
</li>
<li routerLinkActive="active"
[routerLinkActiveOptions]="{ exact: true }">
<a routerLink="/sitio" fragment="invierte">Invierte</a>
</li>
<li routerLinkActive="active"
[routerLinkActiveOptions]="{ exact: true }">
<a routerLink="/sitio" fragment="contacto">Contacto</a>
</li>
Три разных URL-адреса, приведенные выше, следующие:
-
/sitio#inicio
-
/sitio#invierte
-
/sitio#contacto
Но при каждом нажатии любой из них все они отмечены как активные (поскольку они соответствуют информации routerLink="/sitio"
и fragment=*
), которые не включены в проверку. Это приводит к тому, что панель навигации выглядит так: нажав на любой из них:
Любые идеи о том, как это сделать?