Angular-7 选项卡上的活动 link 不起作用？

Question

我有 4 个图标，我正在尝试 active link 像这样 -但它不工作不知道为什么我想我在 更改路由器 时也遗漏了一些步骤我需要 突出显示 该路由器标签。这是我的一个模块的 .Html 文件 -（我只在 .html 而不是 .ts 文件中进行了更改）

 <div class="smart-manage">
 <a routerLink="/dashboard" class = "active" routerLinkActive = "active"[routerLinkActiveOptions]="{exact: true}" >
              <span data-toggle="tooltip" title="Smart Dashboard" data-placement="right">
               <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0
                                20 20" width="20" height="20">

Answer 1

取你的代码：

 <a routerLink="/dashboard" class="active" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">

当url为'/dashboard'时，活动的class将被添加到a标签中。如果 url 更改，则 class 将被删除。

问题：你添加 class 无论如何 class="active"

尝试：

<a routerLink="/dashboard" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">

有样式：

.active { color: red; }

a 标签文本将在活动时显示为红色。

Angular-7 选项卡上的活动 link 不起作用？

Angular-7 active link on tab is not working?

javascript

angular

angular7

mean-stack