如何从组件内的Router params更新值？

Question

我正在使用Angular5。 我有Header组件。 目标：我需要在标头中实施 breadcrumbs 。 我的看法： 路由已经实现，我只需要：

1. 从网址
解析ID
2. 从BackEnd获取项目
3. 获取姓名
4. 将名称设置为面包屑到标题组件

我目前的进展：

我可以使用以下代码从URL解析ID：

this.activatedRouter.params.subscribe(params => {
        this.id = params['id'];
    });

现在，在模板中我有：

<ul class="breadcrumb">
    <li><a routerLink="/items" routerLinkActive="active">Items</a></li>
    <li>{{id}}</li>
</ul>

问题：每次执行新路由后如何更新Component中的ID值？

例如：

1. 我在Items Page =＆gt;我的网址localhost：4002 / items
2. 我点击了Item，然后重定向到Items page =＆gt;我的网址localhost：4002 / items / 34 =＆gt;我的面包屑=物品＆gt; 34

提前致谢

Answer 1

你可以使用：

constructor( private route: ActivatedRoute) {}

this.route.routerState.params.subscribe(params => {
    this.id = params['id'];
});

您的组件将使用新状态

进行更新

Answer 2

我找到了解决方案

constructor(private router: Router) {
    this.router.events.subscribe((val: NavigationEnd) => {
...action with val.url variable
    }
}

每次重定向后，您都会从网址获取数据。