Angular2（rc4） - 检查父组件中的活动子路由

我正在尝试检查父组件中的活动子路由，但我遇到了问题。Angular2（rc4） - 检查父组件中的活动子路由

我曾尝试做这样的事情订阅ActivatedRoute：

class ParentComponent { 
    constructor(private _route:ActivatedRoute) {} 

    ngOnInit() { 
     this._route.data.subscribe(value => console.log(value)}); 
    } 
}

我已经阅读了很多关于堆栈溢出的线程，但找不到检查以及关于被更新的解决方案父组件的子路由。

任何想法？

来源

2016-07-30 Valdemar Edvard Sandal Rolfsen

您可以使用下面的代码片段

constructor(private router:Router, private currentActivatedRoute:ActivatedRoute) 
// this should be called in ngOnInit 
    var state = this.router.routerState 
    var children = state.children(this.currentActivatedRoute)

RouterState，Tree

来源

2016-07-30 10:10:52

非常感谢:) –

'属性'儿童'不存在'RouterState''类型...：/ – Inigo

不确定是否因为此答案发布而发生了变化，但儿童是ActivatedRoute的属性，而不是路由器 – Inigo

在写这几行访问活动子路线，所选答案似乎不工作了。

如果您希望在路线更改时收到通知，您可以订阅Router.events observable。例如，NavigationEnd事件的URL存储为一个属性：

this.router.events.filter(evt => evt instanceof NavigationEnd) 
        .map(evt =>evt.url) 
        .subscribe(url=>console.log(url));

如果要比较当前路线孩子路径 - 让我们说"child" - 。您可以使用Router.isActive()方法：

let events = this.router.events; 
events.filter(evt => evt instanceof NavigationEnd) 
     .map(() =>{ 
      let exact=true; 
      let childRoute=this.router.createUrlTree(["child"], {relativeTo: this.route} 
      return this.router.isActive(childRoute,exact); 
     }) 
     .subscribe(active=>console.log(`child route is active :${active`));

注：

this.router是一个Router实例
this.route是ActivatedRoute
exact一个实例是用来做精确匹配：如果路由是"child/grand-child"this.router.isActive(route,true)会返回假

来源

2016-12-06 14:38:05 n00dl3

获取此错误..类型'Event'上不存在'property'url' 'RouteConfigLoadStart'类型中不存在属性'url' –

@Aakriti您需要过滤路由器事件并仅采用'NavigationEnd'事件。 'this.router.events.filter（evt => evt instanceof NavigationEnd）'（可能需要将类型断言为'Observable '，如下所示：'this.router.events.filter（evt => evt instanceof NavigationEnd）作为Observable ' – n00dl3

我们将如何使用map ..它说'找不到名称映射表' –

Angular2（rc4） - 检查父组件中的活动子路由

回答

相关问题