角度ルーティングの使い方

Question

ページ1（親URLはparent1 - parent1/page1）とページ2（親URLはparent2 - parent2/page2）と言う2つのページからアクセスできるページ（ページ3）があります。

角度はデフォルトでURLを変更するので、私はpage2からナビゲートしているときにのみURLの変更を防止したいと思います。ページ1（parent1として親urlを持つすべてのページ）からナビゲートしているとき、 。

我々は

router.navigate('page2',{skipLocationChange: true}); 

によってこれを行うことができますが、私は共通の場所でこれを行うことができますどのように私はpage4、PAGE5、page6、などのようなより多くのページを持っているので、私は、特定のページの位置変化を防止したいです。

Answer 1

私は、障害のないきれいな方法は、アプリケーション固有のニーズを実装するヘルパークラス（または関数）でルータのナビゲーションをラップすることだと思います。

@Injectable 
class LocationAwareRouter { 
    constructor(private router: Router) { 
    } 

    public navigate(url: string) { 
     this.router.navigate(url, { skipLocationChange: this.isLocationChange(url) }; 
    } 

    private isLocationChange(url: string): boolean { 
     return /* your fancy URL evaluation here */ ; 
    } 
} 

あなたが特定のコンポーネントにルータイベントにサブスクライブでき

Answer 2

：あなたが親URLが何であるかをチェックして、このようなhistory.replaceState()

ような方法でそれをオーバーライドすることができ イベントハンドラで https://v2.angular.io/docs/ts/latest/api/router/index/NavigationStart-class.html

（ナビゲーションキック後）

すべてのルールが定義されている（つまり、どのURLを上書きするのか、またはないのか）というグローバル設定の注射可能なものを作成できます。この方法では、すべてrouter.navigateをリファクタリングする必要はありませんが、コンポーネントクラスのコンポーネントごとにルールを1回指定するだけです。

constructor(router: Router, overrideUrlService: overrideUrlService) { 
    router.events.subscribe(event => { 
    if(event instanceof NavigationStart) { 
     //have the override logic in some injectable service 
     overrideUrlService.checkUrl(event.url); 
    } 
    } 
});