2017-01-13 18 views
4

私は、ドメインに基づいてサイトコピーを取得するアプリケーションを開発中です。私は1つの例外を処理するアプリを持っている。私は以下のようにapp.componentテンプレートでアプリケーションのnavbarとfooterを定義しています。Angular 2でappコンポーネントを解決する適切な方法

<navigation></navigation> 
    <router-outlet></router-outlet> 
    <appFooter></appFooter> 

そしてappFooterためのテンプレートやナビゲーションの内側に私は、私が本当にやりたい何

<p>{{copyService.copy?.somevalue}}</p> 

以下のような安全なnavifation演算子を使用してデータを解決していますリゾルバとActivatedRouteのデータプロパティを使用していますこのようなことをするには

をアプリコンポーネントに追加します。次に、入力変数を介してフッターとナビゲーションにデータを渡します。

残念ながら、私は誰もがこれを完了について行くための最良の方法についてのアイデアを持っている場合、私は

{ path: '', redirectTo: '/home', pathMatch: 'full'}, 

以下のように私の自宅のコンポーネントにリダイレクトしていたとき、私はアプリのコンポーネントの解決については行くだろうかわかりませんタスク私はそれを感謝します。前もって感謝します。

私が提供したコードは単なるコード例であり、私の現在のコードベースからではなく、私が現在持っている問題を説明しようとしていたことをご存知でしょうか。

答えて

6

私がこれを処理できる方法は、app.componentの上に別のコンポーネントレイヤーを追加することでした。

{ path: '', redirectTo: '/home', pathMatch: 'full' }, 
{ path: '', 
    component: BaseComponent, 
    resolve: { 
    yourContent: contentResolver 
    }, 
    children: [ 
    { path: 'home'... } 
    ] 
} 

そして、これらを移動:

<navigation></navigation> 
<router-outlet></router-outlet> 
<appFooter></appFooter> 

をごbase.htmlにあなたがこのBaseComponentで定義あなたのapp.html

解決さから内のすべてのコンポーネントに利用可能になる(およびすべての子ルートに) 。

あなたの探しているものに少し近づくことを望みます。

+0

これは私を助けてくれてありがとうございました。 – TyAnthoney

+0

これを複数のモジュールでどうやってやりますか? – DauleDK

関連する問題