Знаете ли вы, какой ребенок выбран RouteSegment?

Question

Я хотел бы иметь возможность узнать в родительском компоненте или компоненте приложения, какой дочерний маршрут активен. Например, чтобы создать стиль активной ссылки на маршрут. Я вижу, что [routeLink] добавляет класс «router-link-active», но в моем примере у меня есть «дом» с маршрутом «/», который всегда имеет этот класс, независимо от того, какой маршрут я использую. Есть ли какой-нибудь способ увидеть в родительской розетке, на каком пути вы находитесь?

Я впрыскивается Location от @angular/common и я в состоянии увидеть полный путь я думаю, глядя на это, когда изменение маршрута:

ngOnInit() { 
    this.router.changes.subscribe(changes => { 
    console.log('location info:', this.location.platformStrategy.path()); 
    }); 
} 

Есть ли способ, чтобы получить в RouteTree или активный в данный момент RouteSegment от родителя? Или проверить router-outlet и посмотреть, какой компонент загружен в него?

Answer 1

Вы можете получить доступ к текущему маршруту, как

constructor(private router:Router, private routeSerializer:RouterUrlSerializer, private location:Location) { 
    router.changes.first().subscribe(() => { 

     console.log('router', this.router); 
     let urlTree = this.routeSerializer.parse(location.path()); 

     // to get the individual segments of the route use 
     console.log('serializer', urlTree.children(urlTree.root)[0].segment); 
     console.log('serializer', urlTree.children(urlTree.children(urlTree.root)[0])[0].segment); 
    }); 
    } 

Answer 2

После ответа от @Gunter это, как я в конечном итоге делает это:

constructor(
    public router: Router, 
    public routerSerializer: RouterUrlSerializer, 
    public location: Location 
) { } 

ngOnInit() { 
    this.router.changes.subscribe(changes => { 
    this.updatePath(); 
    }); 
} 

updatePath() { 
    let path = this.location.path(); 
    let urlTree = this.routerSerializer.parse(path); 
    let node = urlTree; 
    let segment: UrlSegment = urlTree.root; 
    let result = segment.segment; 
    while (urlTree.children(segment).length > 0) { 
    segment = urlTree.children(segment)[0]; 
    if (result.length > 1) result += '/'; 
    result += segment.segment; // is a string 
    } 

    this.path = result; 
} 

children() принимает UrlSegment и возвращает массив UrlSegment , Корневой сегмент.сегмент пустой строки, я мог бы сделать это, если бы захотел сделать это '/':

this.path = result.length == 0 ? "/" : result;