3

アクションを HTML タグに割り当てることができるように、アクションをビューに割り当てることができるかどうかを知りたいです。

これは機能します：

<button {{action "show2" }}>Test 1</button>

これはしません:

{{#view NewApp.MenuButton }}
   {{action "show3" target="controller"}}
{{/view}}

ビューにクリック機能を実装できることはわかっています。しかし、ボタンをある種の再利用可能なコンポーネントとして使用したいと思います。

4

1 に答える 1

4

通常、ハンドルバーアクション ヘルパーは、.html 要素ではなく HTML 要素で使用しますEmber.View。

NewApp.MenuButton ビューにイベントをアタッチしたいので、ビュー クラス定義でイベントを定義します。たとえば、ここでclickイベントを処理します。

NewApp.MenuButton = Ember.View.extend({

  click: function(event){
    // When the user clicks this view, 
    // this function will be called.

    // ... handle the click
    App.myController.menuButtonWasClicked();
  }
});

添付したいイベントが組み込みイベントでない場合は、独自のイベントを登録できます。サポートされている組み込みのイベントとカスタム イベントの登録方法については、Ember.js - Eventsを参照してください。

編集：あなたはそれを再利用できるようにしたいと言っています。任意のイベントをアタッチし、任意のオブジェクトをターゲットにするための mixin を定義できます。

Ember.MyEventAttacher = Ember.Mixin.create({
   init: function() {
     var action = this.get('action');
         target = this.get('target'),
         targetObj = Ember.getPath(target);

     if (action && targetObj) {
        var targetEventFnc = targetObj[action];

        if (typeof targetEventFnc === 'function') {
           var actionFnc = function(event) {
              targetEventFnc(event);
           }

           this.set(action, actionFnc);
     }

     this._super();
   }
});

ビューに Mixin を含めます。

NewApp.MenuButton = Ember.View.extend(Ember.MyEventAttacher);

そして、テンプレートでこのビューを再利用し、actionおよびtargetプロパティを確実に定義します。例：

{{#view NewApp.MenuButton action="show3" target="NewApp.myController"}}
   <!--  ...  -->
{{/view}}

ターゲティング:

NewApp.myController = Ember.Controller.create({
   show3: function(event) {
      // the event is sent here!
   }
});
于 2012-07-16T13:42:46.277 に答える