角度2 - ページ

Question

に応じて切り替え指令コンポーネントは、私がホーム、についてと高度な検索ページを持っているとしましょう。私のAppComponent htmlで私はこれを持っています：

<view-header></view-header> 
<view-search></view-search> 
<router-outlet></router-outlet> 
<view-footer></view-footer> 

かなり簡単です。最初にヘッダーのhtmlを読み込み、次にデフォルトのhtmlを読み込んだ後にオンにします。

前述のとおり、私はページを持っています。を検索してください。明らかに、view-searchというディレクティブを表示したくないのは、アドバンス検索ページに入っているとかなり役に立たないからです。

私の質問は、私がにルーティングするときに、Angular2に表示検索のディレクティブを無効にするように指示することができます。詳細検索ページ？テンプレートに

<view-header></view-header> 

<!-- If (not in route "/search") --> 
    <view-search></view-search> 
<!-- Endif --> 

<router-outlet></router-outlet> 
<view-footer></view-footer> 

Answer 1

あなたは単にngIfを使用する（または[hidden]に特異的に結合する）ことができます：

---

編集つまり1

は、私はそのような何かをしたい

<view-header></view-header> 
<view-search *ngIf="showViewSearch"></view-search> 
<router-outlet></router-outlet> 
<view-footer></view-footer> 
<router-outlet></router-outlet> 

現在のルートが検索されていないのであればviewSearchコンポーネントのみがレンダリングされshowViewSearch

constructor(private activatedRoute: ActivatedRoute) { 
    this.showViewSearch = activatedRoute.component !== Search 
} 

として定義します。