angular – 对子路由的RouterLinkActive都是false

前端之家收集整理的这篇文章主要介绍了angular – 对子路由的RouterLinkActive都是false前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有以下儿童路线:

{ path: '',component: LoginSingupComponent,children: [
    { path: 'login',component: LoginComponent },{ path: 'singup',component: SingupComponent },]
},

导航到/ login或/ singup工作正常(加载了正确的组件).

这是LoginSingupComponent的摘录

<nav md-tab-nav-bar class="mb-1">
  <a md-tab-link routerLink="/login" routerLinkActive [routerLinkActiveOptions]="{exact: true}" #rla="routerLinkActive" [active]="rla.isActive">Entrar {{rla.isActive}}</a>
  <a md-tab-link routerLink="/singup" routerLinkActive [routerLinkActiveOptions]="{exact: true}" #rla="routerLinkActive" [active]="rla.isActive">Criar uma conta{{rla.isActive}}</a>
</nav>

当打开/登录时,所有rla.isActive == false,当打开/ singup时,所有rla.isActive == true

尝试使用和不使用exact:true

解决方法

试试这样:

<nav md-tab-nav-bar class="mb-1">
    <a md-tab-link [routerLink]="['/']" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">Home</a>
    <a md-tab-link [routerLink]="['/login']" routerLinkActive="active">Login</a>
    <a md-tab-link [routerLink]="['/singup']" routerLinkActive="active">Signup</a>
</nav>

猜你在找的Angularjs相关文章