Question

我有组件可以说客户购买历史记录，显示客户已完成购买的信息。我将显示客户以前购买的清单。

当我点击之前的购买时，我想加载相同的组件，显示购买信息意味着我想导航到具有route-reuse enable的路径的相同组件。我想回去时显示早期的购买历史。有人可以告诉我怎么做。

我在这里做了一个plunker演示，其中包含客户完成的所有购买和购买的列表。

this.router.navigateByUrl('/PurchaseHistory');

是否可以在启用路由重用的情况下路由到同一组件？

Answer 1

您似乎忘记重新加载PurchaseData中的CrisisListComponent。然后，路由到相同的路由是多余的。请参阅plnkr。

EditPurchase(index:any){
  let Id:any=this.PreviousPurchases[index].PurchaseId;
  this.purSrvc.GetPurchaseHistoryByPurchaseId(Id);
  this.getPurchaseData();
  // this.router.navigateByUrl('/PurchaseHistory');
}

其他（我推荐这个）你可以在这里使用的方法（对于i.a.正确处理浏览器的后退按钮）是将id添加到你的路线：

const appRoutes: Routes = [
  { path: 'PurchaseHistory/:id', component: CrisisListComponent },
  { path: 'PurchaseHistoryList', component: HeroListComponent, data: { shouldDetach: true} },
  { path: '',   redirectTo: '/PurchaseHistoryList', pathMatch: 'full' }
];

更新router.navigate（）指令中的路径并订阅router.params事件。

路由到相同的组件

1 个答案: