Question

如果子菜单中的任何一个处于活动状态，则需要在父导航项中的.nav-link中添加一个活动类。

<ul>
    <li class="nav-item">
        <a class="nav-link" (click)="BEDropdownOpen = !BEDropdownOpen" [attr.aria-expanded]="BEDropdownOpen"
            aria-controls="basic-elements-dropdown">
            Elements
        </a>
        <div class="collapse" id="basic-elements-dropdown" [ngbCollapse]="!BEDropdownOpen">
            <ul class="nav flex-column sub-menu">
                <li class="nav-item">
                    <a class="nav-link" routerLink="/accordions" routerLinkActive="active">Accordion</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" routerLink="/typography" routerLinkActive="active">Typography</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" routerLink="/tooltips" routerLinkActive="active">Tooltip</a>
                </li>
            </ul>
        </div>
    </li>
</ul>

如果div.collapse中的任何.nav-link具有活动类，一个活动的类应该添加到父nav-item内的nav-link

Answer 1

您可以为每个链接创建一个模板变量，然后使用ngClass来分配类，如下所示：

<ul>
    <li class="nav-item">
        <a
           class="nav-link"
           (click)="BEDropdownOpen = !BEDropdownOpen"
           [attr.aria-expanded]="BEDropdownOpen"
           [ngClass]="{'active': accordionLink.isActive || typographyLink.isActive || tooltipLink.isActive}"
           aria-controls="basic-elements-dropdown">Elements
        </a>
        <div class="collapse" id="basic-elements-dropdown" [ngbCollapse]="!BEDropdownOpen">
            <ul class="nav flex-column sub-menu">
                <li class="nav-item">
                    <a class="nav-link" routerLink="/accordions" routerLinkActive="active" #accordionLink="routerLinkActive">Accordion</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" routerLink="/typography" routerLinkActive="active" #typographyLink="routerLinkActive">Typography</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" routerLink="/tooltips" routerLinkActive="active" #tooltipLink="routerLinkActive">Tooltip</a>
                </li>
            </ul>
        </div>
    </li>
</ul>

Answer 2

您可以使用program main use gfunc_module implicit none integer, parameter :: dp = kind(1.0d0) real(dp) :: x = 1. integer, parameter :: n = 4 integer, parameter :: m = 4 real(dp), dimension(n) :: a = [-1., -0.33333333, .033333333, 1.] real(dp), dimension(m) :: b = [-1., -0.33333333, .033333333, 1.] real(dp), dimension(n, m) :: c call gfunc(x, n, m, a, b, c) write(*,*) c end program main的{{1}}属性，然后在父元素上使用isActive。

routerActiveLink

Answer 3

使用@ T.Shashwat的想法。您声明ViewChildren和一个吸气剂

@ViewChildren('rla') links:QueryList<routerLinkActive>
get isActive(){
   return this.links?this.links.find(x=>x.isActive)!=null:false
}

为导航链接添加活动类

3 个答案: