如何从 ActivatedRoute 获取有角度的 5 个路线段？

Question

我正在使用最新的 angular5 版本。我有以下编码路线（注意水果和蔬菜不是参数：

/fruits/item
/veggies/basket

请注意，fruits 是父路由，我在一个数组中有多个子路由（item 只是其中之一）。'veggies' 也是一个父路径。'basket' 是 veggies 路线下数组中的“子路线”之一。

我如何使用“ActivatedRoute”，但如何访问路线的第一个“水果”或“蔬菜”部分？我想检查它并将其注销到控制台。

假设 Activated route 已经被注入到变量“route”中。

寻找类似这个伪代码的东西（如果它是正确的）

showRouteRoot() {
   console.log(this.route.getFirstSegmentNameInRoute()) 
// expected output is fruits OR veggies. 
// If this can't be done in one line of code, 
// multiple lines is an acceptable answer
}

我试过了：

console.log(this.route.snapshot.url.split('/'));

这会产生问题。

console.log(this.route.url)

这向我展示了一些匿名主题

console.log(this.route.parent.url)

这向我展示了一个 BehaviorSubject

Answer 1

ActivatedRoute提供了一个成员pathFromRoot，让开发人员从 root 获取完整的 activedroutes，请参阅文档。

对于您的情况，您可以使用以下代码块来实现它：

this.activatedRoute.pathFromRoot[1].url.subscribe(val => console.log(val[0].path));

提到当前的结果pathFromRoot包含一个空路由（ 的第一个元素ActivatedRoute[]），这意味着路径''。

Answer 2

你可以这样做：

let url = this.activatedRoute.snapshot.url.join().split(',')
console.log(url[0]); 

如果要检索父路由，请查看此处。