# Actions in routes

**URL:** <https://discuss.emberjs.com/t/actions-in-routes/14804>\
**Category:** Uncategorized\
**Created:** [May 21, 2018, 3:58pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804 "2018-05-21T15:58:12Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ben\_Glancy](https://avatars.discourse-cdn.com/v4/letter/b/9de053/32.png) [@Ben\_Glancy](https://discuss.emberjs.com/u/Ben_Glancy)\
**Post date:** [May 21, 2018, 3:58pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/1 "2018-05-21T15:58:12Z")

</div>

Hi,

I had started a habit of putting actions in routes instead of the controller, but found that randomly it throws errors in some cases, complaining the action isn’t found in the controller.

> EmberError {stack: “Error: Assertion Failed: An action named 'fontChan…0/roomviewer-tradehelp/assets/vendor.js:18479:39)”, description: undefined, fileName: undefined, lineNumber: undefined, message: “Assertion Failed: An action named ‘fontChanged’ wa…adehelp@controller:user/planner/edtext::ember706\>”, …}code: undefineddescription: undefinedfileName: undefinedlineNumber: undefinedmessage: "Assertion Failed: **An action named ‘fontChanged’ was not found in \<ember-roomviewer-tradehelp@controller:user/planner/edtext::ember706** \>"name: "Error"number: undefinedstack: "Error: Assertion Failed: An action named ‘fontChanged’ was not found in \<ember-roomviewer-tradehelp@controller:user/planner/edtext::ember706\>↵ at new EmberError ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:24127:25](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:24127:25))↵ at assert ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:24370:15](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:24370:15))↵ at makeClosureAction ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:28714:50](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:28714:50))↵ at exports.default ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:28395:12](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:28395:12))↵ at [http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:11949:21↵](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:11949:21%E2%86%B5) at AppendOpcodes.evaluate ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:11725:13](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:11725:13))↵ at VM.next ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18901:32](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18901:32))↵ at VM.execute ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18887:31](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18887:31))↵ at TryOpcode.handleException ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18286:16](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18286:16))↵ at UpdatingVMFrame.handleException ([http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18479:39](http://localhost:4200/roomviewer-tradehelp/assets/vendor.js:18479:39))" **proto** : ExtendableBuiltin

Is this intended? The action exists in the router instead. Some of the other actions on the page are fine.

Thanks for any suggestions

---

<div class="post-metadata">

**Author:** ![efx](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/efx/32/17920_2.png) [@efx](https://discuss.emberjs.com/u/efx)\
**Post date:** [May 21, 2018, 7:47pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/2 "2018-05-21T19:47:39Z")

</div>

I’m not sure why it would fail intermittently. Perhaps the asynchronous routing? One approach to do this explicitly is set a property on your controller that references the route:

```nohighlight
// this is a routing hook that should go in your routes
setupController(controller) {
   controller.set('currentRoute', this);
}

```

From a route’s template, you can then configure the [action helper’s](https://emberjs.com/api/ember/3.1/classes/Ember.Templates.helpers/methods/action?anchor=action) `target` option:

```nohighlight
{{my-component someAction=(action 'onRoute' target=currentRoute)

```

Though this kind of suggestion should be taken with caution. As an aside, I remember reading a chart demonstrating the event flow of actions throughout an application. Something like this would be helpful to better explain what is going on here.

---

<div class="post-metadata">

**Author:** ![larryh](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/larryh/32/16498_2.png) [@larryh](https://discuss.emberjs.com/u/larryh)\
**Post date:** [May 22, 2018, 1:46pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/3 "2018-05-22T13:46:54Z")

</div>

Could it be that the not-found-in-controller errors are coming from calling the action from a component, while the others that are found are being called from a template?

If so, I think components can only reference actions that live in controllers, not routes. Here is a discussion related to that same topic: [Calling route action from a component fails](https://discuss.emberjs.com/t/calling-a-route-action-from-a-component-fails/14687)

---

<div class="post-metadata">

**Author:** ![Ben\_Glancy](https://avatars.discourse-cdn.com/v4/letter/b/9de053/32.png) [@Ben\_Glancy](https://discuss.emberjs.com/u/Ben_Glancy)\
**Post date:** [May 28, 2018, 11:42am UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/4 "2018-05-28T11:42:57Z")

</div>

In this case it is not in a component. It is in a template directly belonging to the route. It is a select box change event. Maybe there is something special about this type of event that it has to be in the controller.

---

<div class="post-metadata">

**Author:** ![Ben\_Glancy](https://avatars.discourse-cdn.com/v4/letter/b/9de053/32.png) [@Ben\_Glancy](https://discuss.emberjs.com/u/Ben_Glancy)\
**Post date:** [May 28, 2018, 11:43am UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/5 "2018-05-28T11:43:24Z")

</div>

I see what you mean, but it bugs me that I have to find my own workarounds for something that is really supposed to work.

---

<div class="post-metadata">

**Author:** ![efx](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/efx/32/17920_2.png) [@efx](https://discuss.emberjs.com/u/efx)\
**Post date:** [May 29, 2018, 8:59pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/6 "2018-05-29T20:59:04Z")

</div>

certainly is frustrating! I remember seeing a diagram that depicted actions bubbling through an ember application. It seems one could help here to clarify the expected behavior.

---

<div class="post-metadata">

**Author:** ![balint](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/balint/32/12521_2.png) [@balint](https://discuss.emberjs.com/u/balint)\
**Post date:** [May 31, 2018, 6:50pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/7 "2018-05-31T18:50:42Z")

</div>

Where it doesn’t work, you’re probably using closure actions in which case the referred action is looked up in the context of the template. The context is the controller in case of “route-driven” templates and the component in the case of component templates. Closure actions don’t bubble: if they’re not found in the context of the template, the error you pasted is thrown.

Example of a closure action: `<button onclick={{action "updateRating"}}>`

Where it works, you probably use a “string” action, where only a string is passed, like

`{{user-form save="saveUser"}}`

This is definitely a complicated area in Ember.js, here are a few resources that might help:

- [A note on actions | EmberMap](https://embermap.com/notes/26-a-note-on-actions)
- [Ember closure actions have return values](https://alisdair.mcdiarmid.org/ember-closure-actions-have-return-values/)
- [EmberConf 2018: Deep Dive on Ember Events by Marie Chatfield - YouTube](https://www.youtube.com/watch?v=G9hXjjHFJVs)

---

<div class="post-metadata">

**Author:** ![larryh](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/larryh/32/16498_2.png) [@larryh](https://discuss.emberjs.com/u/larryh)\
**Post date:** [June 1, 2018, 1:48pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/8 "2018-06-01T13:48:29Z")

</div>

Thanks a lot for weighing in on this, Balint.

BTW, I have both of your Ember books (v2 and v3) and like them a lot. If anyone else ends up here I highly recommend checking them out:

[Rock And Roll With Ember JS](https://balinterdi.com/rock-and-roll-with-emberjs/)

---

<div class="post-metadata">

**Author:** ![jelhan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jelhan/32/16917_2.png) [@jelhan](https://discuss.emberjs.com/u/jelhan)\
**Post date:** [June 30, 2018, 10:42am UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/9 "2018-06-30T10:42:58Z")

</div>

I always use [`ember-route-action-helper`](https://github.com/DockYard/ember-route-action-helper) for this cases. It’s working quite nicely and also documents if the action is defined in Controller or Route.

---

<div class="post-metadata">

**Author:** ![balint](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/balint/32/12521_2.png) [@balint](https://discuss.emberjs.com/u/balint)\
**Post date:** [July 6, 2018, 8:21pm UTC](https://discuss.emberjs.com/t/actions-in-routes/14804/10 "2018-07-06T20:21:45Z")

</div>

Hey Larry,

I’m only seeing this now, but each new happy reader I learn about makes me happy, so thank you!
