获取子组件中的角度路由参数答案

【问题标题】：get angular route parameters in child components获取子组件中的角度路由参数
【发布时间】：2019-11-14 16:28:19
【问题描述】：

我很难正确处理子组件的路由参数。

我有一个这样的路由参数：

{ path: 'bin-view/:pileid', loadChildren: () => import(`./bin-view/bin-view.module`).then(m => m.BinViewModule) }

以及我传入参数的链接：

<a [routerLink]="['/bin-view', _pileid]" routerLinkActive="active">view bin</a>

然后在我的子组件上下文中，我有以下内容：

export class OverviewComponent implements OnInit {

    private _pileid;

    constructor(private _activatedRoute:ActivatedRoute) { 
        this._pileid = this._activatedRoute.snapshot.paramMap.get('pileid');
    }

    ngOnInit() {
        console.log(this._pileid);
    }

}

但这一直给我一个null 值。我在这里错过了什么？

【问题讨论】：

你看到URL中的参数了吗？此外，如果组件有可能被重用，则不应使用快照。可能是，组件首先在没有参数的情况下初始化，并将属性设置为 null，并且由于您使用的是快照，因此不会更新它。试试 this._activatedRoute.paramMap.subscribe() 代替。在这里阅读更多：angular.io/guide/router#activated-route-in-action
是的，当我单击[router-link] href 时，我在 URL 中看到了 _pileid 值：/bin-view/517530/overview，因此它肯定会正确填充 URL。当我进入子组件上下文时无法阅读它。

标签： angular parameters routing

【解决方案1】：

使用parent 代替snapshot.paramMap

constructor(private route: ActivatedRoute) { }

ngOnInit() {
  this.route.parent.params.subscribe(params => {
    this.pileid = params[pileid];
  });
}

【讨论】：

引用.parent 会不会很脆弱？还是有更强大的方法来引用参数？
既然是父级的参数，所以引用父级是有意义的。
明白了。谢谢你的帮助。有道理！