は2角度：アプリのメインテンプレートの表示/非表示のdivの異なるコンポーネントから

Question

私はいくつかのコンポーネントとの角度2のアプリがあります。

- app 
    - sidebar-panel 
    - main-panel 
    - obj-container (1) 
    - obj-container (2) 
    - (etc) 
    - footer-panel 

を基本的には、どのような私がしたいことはdinamicallyフッターパネルを表示/非表示にすることです：

• 「obj-container」内のオブジェクトをダブルクリックすると表示されます。私はAngular 'dblclick'イベントのハンドラから、それぞれの 'obj-container'コンポーネントコードの中でそれを行いたいと思っています。
• HTMLテンプレート内で、フッターパネルには非表示にする閉じるボタンが必要です。
• 両方の表示/非表示アクションにjutsy 'slideToggle'メソッドのようなアニメーションエフェクトがあるといいでしょう。 「アプリ」コンポーネントのテンプレートで

「フッターパネルは、次のように挿入されます。今のところ

<div class="cell medium-3 footer" id="footerPanel"> 
    <app-footer-panel></app-footer-panel> 
</div> 

、私はこれを行うことができると思う唯一の方法は、上の変数を作成することです」 app 'コンポーネントを作成し、フッターdivの* ngIfをバインドして非表示にするか、その値に応じて表示します。そして、各 'objコンテナ'コンポーネントで、@Outputイベントを作成します。@Outputイベントは、ユーザーが閉じるボタンをクリックするたびに起動され、親 'app'コンポーネントによってキャプチャされてdiv可視性を変更します。

しかし、私はこの解決策が複雑すぎると思っています。また、jQueryのアニメーション効果が不足していると思います（必要ではありませんが、入手できるかどうかを知りたい）。

アイデア？ありがとう、

Answer 1

あなたはすでに* ngIfでうまくいっています。 * ngIfでフッターを表示したり非表示にすることができます。 Like：

<footer *ngIf="showFooter"></footer> 

他のコンポーネントのボタンとフッターの閉じるボタンのdblclickのshowFooterの値を切り替えます。親コンポーネントからフッター（子）コンポーネントに渡す場合は、角度ソースhereを参照してください。ヒント：@Input（）は必要なものです。 アニメーションには、Angularに必要なものがすべて用意されています：here