从浏览器中单击“返回上一页”后，Angular路由器导航不起作用

Question

我有一个项目列表，Onclick="()"打开了该特定项目的详细信息部分，详细信息部分是懒惰加载的，但是我遇到的问题是，当我单击“返回上一页”时，单击浏览器中的“后退”按钮），路由器更改，并且“详细信息”部分已关闭，但是如果我单击该项目并且路由未更改，则无法再次打开。

module.routing

const routes: Routes = [
  {
    path: '',
    component: BacklogComponent,
    children: [
      { path: 'details/ie/:id', redirectTo: 'details/ie/:id/DETAILS', pathMatch: 'full' },
      {
        path: 'details/ie/:id/:detailsSection',
        loadChildren: () => import('../lazy/backlog-item-details-ie.module').then((mod) => mod.BacklogItemDetailsIeModule),
        data: { preload: true, delay: 2500 }
      },
      { path: 'details/:id', redirectTo: 'details/:id/DETAILS', pathMatch: 'full' },
      {
        path: 'details/:id/:detailsSection',
        loadChildren: () => import('../lazy/backlog-item-details.module').then((mod) => mod.BacklogItemDetailsModule),
        data: { preload: true, delay: 2500 }
      },
      { path: 'configuration', loadChildren: () => import('../lazy/configuration.module').then((mod) => mod.ConfigurationModule) }
    ]
  }
];

选择项目

  public selectItem(event: MouseEvent, position: DetailSections) {
    this.log.trace(`selectItem() in backlog item comp. id: ${this.backlogItem.id}`);
    this.eventService.hideBoardCreator.emit();
    // as the click to these events are bound on the DOM on childs of the click to the details -> we need to stop the event here
    // if TS on other card is shown, it needs to be hidden
    event.stopPropagation();

    // save selection into store
    this.store.dispatch(new BacklogItemSelected(this.backlogItem));

    // show the details section
    if (!this.configService.appConfig.platform.TRIDENT) {
      this.router.navigate([`HyPE4PM/${this.configService.boardtype}/details`, this.backlogItem.id, DetailSections[position]]);
    } else {
      this.router.navigate([`HyPE4PM/${this.configService.boardtype}/details/ie`, this.backlogItem.id, DetailSections[position]]);
    }

    this.cd.detectChanges();
  }