Ember.js Send actions from routes

Have you guys tried to do something like this:

<button onclick=(action “onClickAction”)></button>

and you get an error like this?

Assertion Error: an action named <action_name> was not found (genereate <route_name> controller)

Using action closures in Ember , this issue can arise when you want to set, for example, an onclick action for a button or any native HTML elements.

I have read many posts related to Ember where they stated that Ember controllers will be deprecated in future versions, therefore I try to stay away from creating controller files in hope that I will have a better transition when the future version is applied

When I first ran into this error, I thought about following the suggestion of the output of the error and generate a controller. But a potential problem for doing this is you might have only one action closure for the entire route and if you have the reoccurring pattern of creating a controller for each action closure, it will be hard to manage all these files in a large project.

A solution for this is to send the action from the controller to the route, without having to create a controller by including it as a property when you declare an action closure like this:

<button onclick=(action send “onClickAction”)></button>

Now when you try to run your ember program, you won’t see the error about creating a controller anymore and you can continue with your flow and work on your code!

This solution was very hard to find. When I ran into this problem, I looked all over to find a solution, andI can’t remember where I found it from, but I saw the syntax and tried it out. And what do you know? It works! Then I researched and found a great post explaining the difference between and when to use send() vs sendAction() by Abhilash L R.

It made a lot of sense why including the send property in the action closure would fix the problem. But there was no reference included in the Ember documentation for this technique. By making this post, I hope to save you all the headaches of how to resolve this issue and hopefully spread the word on this trick for other Ember developers out there!