ember.js - Different actions for Different events on same element using action helper

Question

I have a div which should execute the method speak on click:

Corresponding Action Helper:

<div {{action speak}}>Say</div>

If it were to execute the method wiggle on mouse enter:

Corresponding Action Helper:

<div {{action wiggle on="mouseEnter"}}>Say</div>

Now I want to combine both, I want it to execute speak on click as well as execute wiggle on mouseEnter

what would be the corresponding {{action}} helper ?

Your Attention !

I know the following would work:

App.MultiEventView = Ember.View.extend({
  click: function(){
    /* some code */
  },
  mouseEnter: function(){
    /* some code */
  }
})

{{ view App.MultiEventView }}

But can we define multiple events using action helper instead of defining the view ?

Answer 1

Not on the same div. {{action}} translates to a data-ember-action attribute on the element, and there's no mechanism for overloading that for more than one action.

What you can do is wrap your div in another div with the second action.