当孩子在标题栏中处于活动状态时，我的父路由器如何处于活动状态？

Question

我创建了一个具有下拉父路由的标头。下拉菜单打开 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)
      },
    ]
  }
];