angular2 как скрыть родительские ссылки на маршрутизатор

Question

В angular2 мне нужно найти способ скрыть родительские ссылки маршрутизатора. Я должен показать ТОЛЬКО информацию самого низкого уровня - НЕ дерево маршрутизации, которое привело меня к этому уровню.

Я использую Angular 2.0 final. Я не использую angular-cli, и я не могу переключиться на него. Весь мой код содержится в этом шлепнуть: http://plnkr.co/edit/EdLY62A8GfVimEn48HaA

Когда пользователь щелкает на «О» routerLink, я должен показывать ТОЛЬКО «О содержании», и скрываем «Home» и «О» routerLinks

.

Это же требование выполняется для любых дочерних маршрутов, которые могут существовать для «О». В любой точке дерева маршрутизации я должен показывать ТОЛЬКО варианты этого уровня - все родительские маршруты маршрутизации, которые привели меня к этой точке, НЕ ДОЛЖНЫ быть

Компонент приложения:

import { Component } from '@angular/core'; 
 

 
@Component({ 
 
    selector: 'demo-app', 
 
    template: ` 
 
    <a [routerLink]="['/']">Home</a> 
 
    <a [routerLink]="['/about']">About</a> 
 
    <div class="outer-outlet"> 
 
    <router-outlet></router-outlet> 
 
    </div> 
 
    ` 
 
}) 
 
export class AppComponent { }

Answer 1

Чтобы скрыть и показать конкретные ссылки в зависимости от нашего текущего маршрута, нам нужно:

Знают наш текущий маршрут

// Router contains our current path 
    import { Router, NavigationStart, Event as NavigationEvent } from '@angular/router'; 

Слушайте изменения маршрута, чтобы получить текущий путь и обновить ссылки

constructor(private router: Router) { 

     router.events.subscribe((event: NavigationEvent) => { 
     if (event instanceof NavigationStart) { 
      let activeRoute: string = event.url; 
      // Now that we know the path 
      // we can determine which links to hide 
     } 
     }); 

    } 

More navigation events

Вот такой demo