Angular 6 - 可重用组件 - 路线导航

Question

目前，正在为三个不同的组件呈现完全相同的表结构，该表结构位于共享文件夹中。问题是，我在桌子上有后退按钮，每当我点击它时，它应该从它的实际来源导航回组件视图。

假设：

componentA -> commonTblCompoent - click Back - go to componentA 
componentB -> commonTblCompoent - click Back - go to componentB 
componentC -> commonTblCompoent - click Back - go to componentC

现在导航只发生在组件 A 上。如何巧妙地改变路由配置。

compoentA.ts

gotoCommonTbl {
    this.router.navigate(['cmnTable/commonTbl']);
}

compoentB.ts

gotoCommonTbl {
    this.router.navigate(['cmnTable/commonTbl']);
}

commonTbl.ts

gotocurrentComponent() {
//this.router.navigate(['componentA/comp-A']);

// this is supposed to be changed for proper navigation
}

谁能告诉我如何重写和解决这个问题？如果可能，请分享任何示例工作演示

谢谢大家

Answer 1

您可以考虑在CommonTbl 中使用Location 类并将用户送回他们来自的地方：

import { Location } from '@angular/common';

constructor(private location: Location) { }

gotocurrentComponent() {
  this.location.back();
}

https://stackblitz.com/edit/angular-yajvoj