Question

我在app.component.html中使用以下代码进行子导航，但是在选择了转到下一页的subnav链接后，选择不会保持突出显示，只是主页TAB 。我错过了什么？

// SomeLogic.h
class SomeLogic
{
};

// A.h
#include "SomeLogic.h"
class A
{
    SomeLogic someLogic;
};

// B.h
#include "SomeLogic.h"
class B
{
    SomeLogic someLogic;
};

> <nav class="subnav">

Answer 1

如果你正在使用Angular路由器，你必须把

routerLinkActive="active"

每个链接

检查here

Answer 2

active类，在您的示例中硬编码为仅在Home链接上。由于它是Angular，因此您应该像对任何Angular链接一样调整锚标记。如果你将Angular与subnav一起使用，它应该是这样的。

<nav class="subnav">
  <ul class="nav">
    <li class="nav-item">
      <a class="nav-link" routerLink="/home" routerLinkActive="active">Home</a>
    <li class="nav-item">
      <a class="nav-link" routerLink="/dashboards" routerLinkActive="active">Dashboards</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" routerLink="/tools" routerLinkActive="active">Tools</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" routerLink="/faqs" routerLinkActive="active">FAQs</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" routerLink="/about" routerLinkActive="active">About</a>
    </li>
  </ul>
</nav>

清晰度UI子导航

2 个答案: