Ember.ActionHandler Class packages/ember-runtime/lib/mixins/action_handler.js:10
PRIVATE
Defined in: packages/ember-runtime/lib/mixins/action_handler.js:10
Module: ember-runtime
Ember.ActionHandler is available on some familiar classes including
Ember.Route, Ember.View, Ember.Component, and Ember.Controller.
(Internally the mixin is used by Ember.CoreView, Ember.ControllerMixin,
and Ember.Route and available to the above classes through
inheritance.)
send
(actionName, context)
public
Triggers a named action on the ActionHandler. Any parameters
supplied after the actionName string will be passed as arguments
to the action target function.
If the ActionHandler has its target property set, actions may
bubble to the target. Bubbling happens when an actionName can
not be found in the ActionHandler's actions hash or if the
action target function returns true.
Example
1 2 3 4 5 6 7 8 9 10 |
App.WelcomeRoute = Ember.Route.extend({
actions: {
playTheme: function() {
this.send('playMusic', 'theme.mp3');
},
playMusic: function(track) {
// ...
}
}
});
|
Parameters:
- actionName String
- The action to trigger
- context *
- a context to send with the action
actions
Object
public
The collection of functions, keyed by name, available on this
ActionHandler as action targets.
These functions will be invoked when a matching {{action}} is triggered
from within a template and the application's current route is this route.
Actions can also be invoked from other parts of your application
via ActionHandler#send.
The actions hash will inherit action handlers from
the actions hash defined on extended parent classes
or mixins rather than just replace the entire hash, e.g.:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
App.CanDisplayBanner = Ember.Mixin.create({
actions: {
displayBanner: function(msg) {
// ...
}
}
});
App.WelcomeRoute = Ember.Route.extend(App.CanDisplayBanner, {
actions: {
playMusic: function() {
// ...
}
}
});
// `WelcomeRoute`, when active, will be able to respond
// to both actions, since the actions hash is merged rather
// then replaced when extending mixins / parent classes.
this.send('displayBanner');
this.send('playMusic');
|
Within a Controller, Route, View or Component's action handler,
the value of the this context is the Controller, Route, View or
Component object:
1 2 3 4 5 6 7 8 9 |
App.SongRoute = Ember.Route.extend({
actions: {
myAction: function() {
this.controllerFor("song");
this.transitionTo("other.route");
...
}
}
});
|
It is also possible to call this._super(...arguments) from within an
action handler if it overrides a handler defined on a parent
class or mixin:
Take for example the following routes:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
App.DebugRoute = Ember.Mixin.create({
actions: {
debugRouteInformation: function() {
console.debug("trololo");
}
}
});
App.AnnoyingDebugRoute = Ember.Route.extend(App.DebugRoute, {
actions: {
debugRouteInformation: function() {
// also call the debugRouteInformation of mixed in App.DebugRoute
this._super(...arguments);
// show additional annoyance
window.alert(...);
}
}
});
|
Bubbling
By default, an action will stop bubbling once a handler defined
on the actions hash handles it. To continue bubbling the action,
you must return true from the handler:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
App.Router.map(function() { this.route("album", function() { this.route("song"); }); }); App.AlbumRoute = Ember.Route.extend({ actions: { startPlaying: function() { } } }); App.AlbumSongRoute = Ember.Route.extend({ actions: { startPlaying: function() { // ... if (actionShouldAlsoBeTriggeredOnParentRoute) { return true; } } } }); |
Default: null