angular - 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上。如何巧妙地更改路由配置。

组件A.ts

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

组件B.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
}

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

谢谢大家

标签： angulartypescript

Answer 1

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

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

constructor(private location: Location) { }

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

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