Цвет моей ссылки не изменяется при нажатии какой-либо ссылки в панели навигации с помощью routerLinkActive - PullRequest
0 голосов
/ 19 апреля 2020

У меня есть этот navar. Когда я нажимаю на некоторые ссылки, цвет не меняется на зеленый. Если я go из дома в профиль, цвет не меняется, но когда я захожу на страницу профиля и затем снова нажимаю на ссылка Сэм, то цвет меняется на зеленый. Где моя ошибка?

<nav>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
    <ul class="navbar-nav">
      <ng-container *ngIf="isTheUserAuthenticated; else elseif1">
        <li class="nav-item">
          <a class="nav-link" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}" routerLink="/">Home
            </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}"
            routerLink="/profile">Profile</a>
        </li>
      </ng-container>
      <ng-template #elseif1>
        <li class="nav-item">
          <a class="nav-link" routerLink="/join">Join</a>
        </li>
      </ng-template>
</nav>

.active {
    color: green;
}

//appmodule.ts

{ path: 'join', component: RegisterLoginComponent,  canActivate: [UnauthenticatedGuard] },
{ path: '', component: SportParentComponent, canActivateChild: [AuthenticatedGuard], children: [
{ path: '', component: SportListComponent },
{ path: 'sport/:sport_id', component: SportOverviewComponent },
}
...