Angular 2 Activatedroute参数不在服务中或在<router-outlet>外部工作

Question

我有一个非常奇怪的问题:index.html

<navigation-menu *ngIf="isLoggedIn"></navigation-menu>
<div class="content-wrapper" [ngClass]="{'fullContent' : !isLoggedIn}">
    <section class="content">
        <router-outlet></router-outlet>            
    </section>
</div>

导航菜单是导航菜单的组件.在路由器插座内容中有一个名为"资产"的组件.

我在资产组件中做了什么:

import { ActivatedRoute}from "@angular/router";
constructor(private route: ActivatedRoute){}
public ngOnInit(): void {
    this.route.params.subscribe(params => {
        const id = params["id"];
}

这有效,我得到了我的路线参数(这是一种"资产/:id").

现在我在导航菜单组件(位于路由器插座外部)和名为contextservice的全局服务中尝试了相同的操作.与上面的代码相同,但在路由更改时甚至没有触发.如果我尝试获取当前路由器快照

  const strId = this.route.snapshot.params["id"];

在触发NavigationEnd事件之后,结果是相同的:strId是未定义的,因为params是一个空对象.

它只适用于我的资产组件.这是按预期工作还是应该如何处理？

我的意图是从全局服务(或导航菜单中的"全局"组件)触发事件,该事件正在监听所有路径(-params)更改.

我唯一的解决方案是在每个NavigationEnd事件之后解析完整的url,在我看来这是不正确的方法......或者处理每个子组件(在路由器插座中)的params更改.

也许我在理解中只有一个基本错误......

谢谢

接受答案的解决方案:

this.router.events.subscribe(val => {
        if (val instanceof RoutesRecognized) {
            var strId = val.state.root.firstChild.params["id"];
        }});

不要忘记从角度路由器导入RoutesRecognized !!

Answer 1

路由器添加的组件获取路由器段(ActivatedRoute),但在服务中没有激活的路由.您可以订阅router.events并遍历路由树(router.firstChild ...`)以获取您需要的特定路由分段的参数.

另见https://github.com/angular/angular/issues/11023