Specify action for view in template?

ember.js

Solution

You typically want to use the Handlebars action helper on an HTML element, not on an `Ember.View`.

Since you want to attach an event to the NewApp.MenuButton View you, define the event in your view class definition. For example, here we handle the `click` event:

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();
  }
});

If the event you want to attach is not one of the built-in events, you can register your own events. Find the built-in supported events and how to register custom events here: Ember.js - Events

Edit: You say you want to be able to reuse it. You can define a mixin for attaching arbitrary events and targeting arbitrary objects:

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();
   }
});

Include the Mixin in your View:

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

And then re-use this view in your templates, making sure to define the `action` and `target` properties. Example:

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

Targeting:

NewApp.myController = Ember.Controller.create({
   show3: function(event) {
      // the event is sent here!
   }
});

Problem

I would like to know if it is possible to assign an action to a view like I could assign an action to a HTML tag: This works: ``` <button {{action "show2" }}>Test 1</button> ``` This doesn't: ``` {{#view NewApp.MenuButton }} {{action "show3" target="controller"}} {{/view}} ``` I know that I could implement the click function in the view. But I would like to use the button as some sort of reusable component.

Original source