ワイルドカードネストされたルートAngular2

Question

Angular 2ルータを使用して、深くネストされたワイルドカードルートをどのように達成しますか。すべてのワイルドカードサンプルコードは、ページが見つかりませんでした。以下のユースケースを想定します。あなたは、ファイルシステム上のフォルダビューアとして機能するプログラムを持っていました。例のルートは、次のものがあります

• /home/Documents/Personal
• /home/Pictures/Vacation/2015
• /home/Pictures/Vacations/2015/10

をこれまでのところ、私は次のことを試してみました：

const r = [ 
    { 
    path: 'home', 
    component: HomeComponent, 
    children: [ 
     { 
     path: '**', 
     component: FolderViewerComponent 
     } 
    ] 
    } 
]; 

作品のこの種。私は、次のURLで、部品にアクセスすることができます。

export class FolderViewerComponent implements OnInit { 
    constructor(private router: Router, private route: ActivatedRoute) { 
    } 

    ngOnInit() { 
    console.log(this.route.url); 
    } 
} 

をしかし、私は新しいルートが同じ部品を使用するのでngOnInitが再びトリガされません同じ周りを移動するとき。したがって、私はサーバーから新しいフォルダの内容を要求する方法がありません。

だから、一日の終わりに：

1. 私はこれを行うべきであるより良い方法はありますか？
2. コンポーネントがない場合でも、ルートが変更されたときに私が購読することができるイベントはありませんか？

Answer 1

私はよりよいアプローチがあると思っていますが、いくつかのコメントに基づいて私はついに次のように決めました。基本的に私はルートの変更を購読し、変更されたときにコードを実行します。

import {Component, OnInit, OnDestroy} from '@angular/core'; 
import {Router} from '@angular/router'; 
import {Subscription} from 'rxjs'; 

@Component({ 
    template: `...` 
}) 
export class FolderViewerComponent implements OnInit, OnDestroy { 

    url: string; 
    routeSub: Subscription; 

    constructor(private router: Router) { 
    } 

    handleRouteChange(event) { 
    if (this.url !== event.url) { 
     this.url = event.url; 
     console.log(`Route changed to ${this.url}`); 
     // Whatever code you want 
    } 
    } 

    ngOnInit() { 
    this.routeSub = this.router.events.subscribe(this.handleRouteChange); 
    } 

    ngOnDestroy() { 
    this.routeSub.unsubscribe(); 
    } 
}