ionic2 コンポーネントにテンプレートのタグ(セレクタ)からパラメータを渡したい

2017年01月21日

  1. TOP
  2. BLOG
  3. angular2
  4. ionic2 コンポーネントにテンプレートのタグ(セレクタ)からパラメータを渡したい

ionic2はangular2ベースでコンポーネント志向です。
そのため共通箇所は全てパーツとしてコンポーネント化するのですが、例えば見出し部分をコンポーネント化した時、
それを呼び出す親のコンポーネントから見出しのコンポーネントに対して見出しのラベルを渡す必要があります。

まず親のコンポーネントがこれ

そして子のコンポーネントがこちら

子のコンポーネントであるpage-titleに対してパラメータを渡して、『タイトル』のラベルを変更させたいのですが、これをテンプレート内で解決したい。

解決方法

出来るかの可否については『可能』でした。
ただ少しめんどくさい・・・・
まずは親のテンプレートはこのように

タグにパラメータを記述しただけですね。これで親は終わり。
続いて子のテンプレートは以下の通り

ここまでは簡単そう!だけどこれでは動かない!!
なので次に子のtsファイルを開いてimportの部分をこのように変更

さらにクラスの部分に『@Input() title;』を記述

これで動く!
詳しい説明?俺がして欲しい!