How do I implement Actions directly on controllers with EmberJS?

Question

I'm trying to implement an action on a controller and get the warning:
DEPRECATION: Action handlers implemented directly on controllers are deprecated in favor of action handlers on an actions object

If I use Em.ObjectController.create(), when I click my button I get a warning stating that actions must be provided at extend time. However, if I use Em.ObjectController.extend(), when I click the button I get an error saying the action did not exist on the controller.

I created a jsBin to view this

//App.ToolbarController = Ember.ObjectController.create({
App.ToolbarController = Ember.ObjectController.extend({
    model: { fu: "baar" },
    actions: {
        doSomethingUseful: function(data) {
            console.log("doing nothing useful...");
        }
    }
});

Ryan Rauh Ryan Rauh · Accepted Answer · 2014-02-07T23:33:56

I took a look at your jsBin

First off in the future its easier to debug your templates if you post them as an embedded script tag instead of the compiled handlebars function.

I've made a bin that fixes your issue.

I believe your issue had to do with the method you were using to create your view.

{{view App.ToolbarView controllerBinding="App.ToolbarController"}}

I'm not sure if that works properly.

Instead you should use the render helper

{{ render 'toolbar' }}

That way ember will try to find the toolbar view, controller and template and wire them all together properly.

How do I implement Actions directly on controllers with EmberJS?

1 Answers