问题描述
我创建了一个具有下拉父路由的标头。下拉菜单打开 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 (将#修改为@)