如何解决当孩子在标题栏中处于活动状态时,我的父路由器如何处于活动状态?
我创建了一个具有下拉父路由的标头。下拉菜单打开 2 个子路径。当我在父路由器中放入链接 routerLink="/dropdown/" 时,如果用户选择 2 个子级之一,则父级会在 css 中加下划线。但是,如果您按照我在代码中发布的内容删除它,则它不会带有下划线。我该怎么做?我不想在 Dropdown 父级中添加路由。我希望 Dropdown 父路由仅作为在子路由器处于活动状态时带有下划线的下拉列表。
我的header.component.html:
<nav class="navigation-bar">
<div class="dropdown">
<a [routerLinkActiveOptions]="{exact: false}" routerLinkActive="link-active" [routerLinkActiveOptions]="{exact: true}" class="dropbtn" (click)="onServicesHeaderClick()">Dropdown</a>
<div class="dropdown-content" *ngIf="isServicesHeaderClicked">
<a routerLink="/dropdown/linkone" routerLinkActive="link-active" (click)="hideServicesHeader()">Link 1</a>
<a routerLink="/dropdown/linktwo" routerLinkActive="link-active" (click)="hideServicesHeader()">Link 2</a>
</div>
</div>
</div>
</nav>
我的app-routing.module.ts:
const routes: Routes = [
{
path: 'dropdown',children: [
{
path: 'linkone',loadChildren: () => import('src/pages/linkone/linkone.module').then(m => m.LinkOneModule)
},{
path: 'linktwo',loadChildren: () => import('src/pages/linktwo/faqs.module').then(m => m.LinkTwoModule)
},]
}
];
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。