I have a controller A
that sent an action with this.send('makeItHappen')
, and I want to handle it in controller B
. How do I do it?
JS:
// controllers/documents/datasets/controller-A
import Ember from 'ember';
export default Ember.Controller.extend({
actions: {
sendToDataCenter() {
this.send('makeItHappen'); // this throws an error
}
}
});
// controllers/controller-B
import Ember from 'ember';
export default Ember.Controller.extend({
actions: {
makeItHappen() {
console.log('It works!!');
}
}
});
In Controller B, it throws an error:
Uncaught Error: Nothing handled the action 'makeItHappen'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble.
Please, can anyone help? Thank you.
In general, each route will have one default controller if it's not defined.
In controller-A, this line of code this.send('makeItHappen');
will look for the makeItHappen
method in actions hash of the datasheets,documents, application controller and its corresponding route if makeItHappen
is defined anywhere then won't get this error.
To implement what you need,
Currently, in your route/controller hierarchy, there is no parent-child relationship between controller-A and controller-B. so you can just inject controller-B inside controller-A and call makeItHappen
directly.
// controllers/documents/datasets/controller-A
import Ember from 'ember';
export default Ember.Controller.extend({
controllerB:Ember.inject.controller('controller-B');//this should be already instantiated ie,this corresponding route should be visited earlier otherwise you will get `unknown injection: controller:users' Error
actions: {
sendToDataCenter() {
this.get('controllerB').send('makeItHappen');
}
}
});