URL 中的更改有效，但 Angular 中未更改路线

Question

单击时

Url 正在按预期变化，但未加载该特定路线。请找到以下代码以供参考。

HTML

<a
  mat-tab-link
  *ngFor="let routeLink of routeLinks; let i = index"
  [routerLink]="routeLink.link"
  [routerLinkActive]="'mat-tab-link-active'"
  #rla="routerLinkActive"
  class="mat-tab-link"
>
  {{ routeLink.label }}
</a>

TS

const path = `/site/`;
this.routeLinks = [
  {
    key: 'network',
    link: path + 'network'
  },
  {
    key: 'subnets',
    link: path + 'subnets'
  }
];

Answer 1

这是我以前用过的。

<nav mat-tab-nav-bar>
  <span
    mat-tab-link
    *ngFor="let routeLink of routeLinks; let i = index"
    [routerLink]="nav.link"
    routerLinkActive
    #rla="routerLinkActive"
    [routerLinkActiveOptions]="{ exact: true }"
    [active]="rla.isActive"
  >
    {{ routeLink.label }}
  </span>
</nav>

<div class="container my-3">
  <router-outlet></router-outlet>
</div>

Answer 2

我的组件在父组件中有多个 router-outlet。我分享的代码片段是子组件，所以路由器没有按预期工作。最后，我明白了我在父组件中将插座添加到路由器插座的根本原因解决了我的问题，如下所示。 HTML

  <router-outlet name="dashboard-outlet"></router-outlet>

路由 TS

const routes: Routes = [{ path: '', component: ComponentName, outlet: 'dashboard-outlet' }];

URL 中的更改有效，但 Angular 中未更改路线

Change in URL is working but route change is not happeningin Angular

angular

typescript

angular-material

angular-routerlink