首页 > 代码库 > Angular2学习笔记——在子组件中拿到路由参数
Angular2学习笔记——在子组件中拿到路由参数
工作中碰到的问题，特此记录一下。
Angular2中允许我们以`path\:id\childPath`的形式来定义路由，比如：
export const appRoutes: RouterConfig = [{ path: ‘app/:id‘, component: AppComponent, children: [ { path: ‘share‘, component: AppShareComponent }, { path: ‘issue‘, component: AppIssueComponent }, { path: ‘version‘, component: AppVersionComponent }, { path: ‘usage‘, component: AppUsageComponent }, { path: ‘notification‘, component: AppNotificationComponent }, { path: ‘resource‘, component: AppResourceComponent }, { path: ‘comment‘, component: AppCommentComponent }, { path: ‘activity‘, component: AppActivityComponent }, { path: ‘retire‘, component: AppRetireComponent }, { path: ‘‘, component: AppComponent } ]}];
如果是在AppComponent中，很容易使用`ActivatedRoute`拿到当前路由获取参数：
ngOnInit() { this.route.params.subscribe((params) => { this.createPies(); this.onTopListFilterChange(params[‘id‘]); }); };
但如果是在`children`中指定的component要拿到路由参数就没那么容易了，这时候再使用ActivatedRoute根本拿不到参数，我猜应当是在Angular2中一个ActivatedRoute对应一级路由配置，所以我们需要找到父级路由，由父级路由去拿参数。这时我们需要借用Router类的routeState属性的parent方法：
this.router.routeState.parent(this.activatedRoute).params.subscribe(params => { this.getDetailsById(params[‘id‘]);})
至此问题解决！
Angular2给我的感觉是大框架很清晰，细节太琐碎，使用后端开发思维来做前端，过于冗余。目前对Angular2了解并不深入，无法给出详细解释，待我深入了解后，再写一篇关于路由的文章奉献给大家。
Angular2学习笔记——在子组件中拿到路由参数
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。