第一个路由器单击的链接不起作用，但工作后单击的任何其他链接

Question

我有一个 Angular 应用程序，页面上有一个 routerLinks 列表。首次加载页面时，单击这些链接中的任何一个都会正确更改地址栏中的 URL，但不会发生页面加载。

但是，单击另一个链接可以正常工作并正确导航到正确的目标。

此问题仅在首次加载页面时发生。如果我在初始页面加载后重新加载页面，一切正常。

链接：

<a [routerLink]="['/organizations/', organization.id]" *ngFor="let organization of myOrganizations">
    <h4>{{organization.name}}</h4>
</a>

路由器定义：

...
{
    path: 'organizations/:organizationId',
    component: OrganizationComponent,
    canActivate: [
      TokenGuard,
      IframeCaptureGuard,
      AuthGuard,
    ],
    data: {
      legacyUrl: '/#/dashboard/:organizationId',
    },
    children: [
      {
        path: 'reports/docs',
        redirectTo: 'reports/docs/info',
        canActivate: [
          TokenGuard,
          IframeCaptureGuard,
          AuthGuard,
        ],
        data: {
          legacyUrl: '/#/docreports/:organizationId',
        },
      },
    ]
  },
...

Answer 1

尝试在path: 'organizations/:organizationId'下添加pathMatch: 'full'