親コンポーネントまたはappコンポーネントで、どの子ルートがアクティブであるかを調べることができます。たとえば、アクティブなルートリンクのスタイルを設定することができます。私は[routeLink]
が 'router-link-active'クラスを追加しているのを見るが、私の例では私はどのルートを使用していても常にそのクラスを持っているルート '/ home'を持っている。どのルートにいるのかをアウトレットの親に見える方法はありますか?親で、どの子供のRouteSegmentが選択されているかを知っていますか?
ngOnInit() {
this.router.changes.subscribe(changes => {
console.log('location info:', this.location.platformStrategy.path());
});
}
RouteTree
または現在アクティブで取得する方法があります:ルート変更をするとき
私は@angular/common
からLocation
注入し、私はこれを見てから推測フルパスを見ることができていました親からのRouteSegment
?または、router-outlet
を確認して、どのコンポーネントがロードされているか確認してください。
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
の配列を返します。これは私がそれをやってしまった方法です@Gunterから