Ember: Bubble action from component to application controller

Question

I have a component in ember, which needs to send an action (with one parameter) to the application controller. No matter where this component is rendered, it needs to call the exact same action, on application controller.

application-controller

export default Ember.Controller.extend({
  actions: {
    addAlert: function(message) {
      this.set('message', message);
    },
    removeAlert: function(message) {
      this.set('message', message);
    }
  }
});

How do I handle this? From start, to end.

Did you check the guide here: guides.emberjs.com/v1.10.0/components/… ? — enspandi
Any reason why you aren't catching it on the application route? — Patsy Issa
@Kitler I am modifying the property on controller, so I want the action to be there — Marco Prins
Actions don't bubble up through controllers, they do bubble up through routes, you can catch it on the application route and set the controller property from there. — Patsy Issa
@Kitler's answer is correct. You will not bubble to the application controller, but you will bubble to the application route. However if you need the same action to be triggered wherever the component is utilized, than why dont you just have the action in the component itself? — JDillon522

Patsy Issa Patsy Issa · Accepted Answer · 2015-08-06T12:05:45

Actions don't bubble up through controllers, when an action is triggered it will go through the current route's controller, if nothing handles it there it bubbles up to the current route all the way up to the top level route (application).

If that action has to set a property on the controller you can set it directly from the application route (although it is not recommended).

// routes/application.js
actions {
  addAlert(message) {
      this.controller.set('message', message);
    },
    removeAlert(message) {
      this.controller.set('message', message);
    }
}

For more information read up on action bubbling.

Ember: Bubble action from component to application controller

1 Answers