Emberjs-comp-sending-actions

EmberJS-アクションの送信

イベントハンドラを使用して、コンポーネントからアプリケーションにアクションを送信できます。

構文

{{comp_name action = "name_of_action"}}

例

以下の例では、コンポーネントからアプリケーションにアクションを送信することを指定しています。 _comp-yield_という名前のコンポーネントを作成し、次のコードで_app/components/_の下に作成されたコンポーネントテンプレートファイル_comp-yield.js_を開きます-

import Ember from 'ember';

export default Ember.Component.extend ({
   actions: {
      compFunc: function () {
         this.set('title', "Hello...Welcome To finddevguides...");

        //sendAction() method sends the specified action when the component is
            used in a template
         this.sendAction();
      }
   }
});

_app/templates/components/_の下に作成された_comp-yield.hbs_ファイルを開き、次のコードを入力します-

<h2>Sending Actions to a Component</h2>
<input type = "button" value = "Click Here" {{action "compFunc"}}/><br/>
<p><b>{{title}}</b></p>
{{yield}}

_application.hbs_ファイルを作成し、次のコードを追加します-

{{comp-yield title = title action = "compFunc"}}
{{outlet}}

出力

emberサーバーを実行します。次の出力が表示されます-

Ember.jsコンポーネント送信アクション

ボタンをクリックすると、下のスクリーンショットに示すようにテキストが表示されます-

Ember.jsコンポーネント送信アクション