~Linux、MySQLからAJAXまでAngular2でoutputs、@Output、EventEmitterを使ってカスタムイベントを定義ユーザー定義のディレクティブで、outputs、@Output、EventEmitterを使ってカスタムイベントを定義する方法を確認し、サンプルを作成しました。※Angular2の2.0.0版、TypeScriptを使って確認したものです。(デモはv4.4.3、v2.0.0で動作確認)※目次をクリックすると目次の下部にコンテンツが表示されます。1.outputs属性、@Output2.カスタムイベントを使ったサンプル3.デモoutputs属性、@Outputカスタムディレクティブで、output属性を使って、呼び出し側ディレクティブへイベント発行行う事ができます。EventEmitter();※以下のようにOutput、EventEmitterをインポートする必要がある。[‘propertyName’],})※EventEmitterのインポートは必要。EventEmitter();2デコレーター内の属性で指定@Directive({outputs:[‘propertyName:alias’]})カスタムイベントを使ったサンプル●仕様1メインコンポーネント・会員データを保持し、リストを表示。・各メンバー表示ディレクティブからの”done”イベント受信で該当会員を削除。2各メンバー表示ディレクティブ・各会員データの表示、削除処理を行う。・以下のように利用する”member-item”というセレクタ名のカスタムディレクティブを作成。[item]=”member”(done)=”removeItem($event)”></member-item>・プロパティバインディング([item]=”member”)でメイン側から各メンバー情報をinputs属性で受け取る。・”done”という名称のカスタムイベントを定義。各メンバーを削除した際、outputs属性を使ってイベントを発行し、呼び出し先に削除した会員のIDを通知する。}3各メンバー表示ディレクティブでイベント発行の定義ユーザーが”Delete”ボタンクリック時に”done”イベントを発行する。“done”イベントは、EventEmitter()のemitメソッドで該当会員のIDを渡す。}4メインコンポーネントが”done”イベントを受信するとremoveItemメソッドを実行する。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。