Ember - bind custom action on route
ember-old-router, ember.js
Solution
It might help to know there is an `enter` event you could handle inside a route:
other: Ember.Route.extend({
route: '/other',
connectOutlets: function(router, context) { /* ...? */ }),
enter: function(router) {
// ...
}
})
Not sure if there's a solution that better suits your needs.
Update: If you use the `action` helper, the click event will trigger the action, as you desire. Example -- in the template: `<a {{action gotoOtherState href="true"}}>Go to other state</a>`, and in the route you were in (or an ancestor... the index route in this case): `gotoOtherState: Ember.Route.transitionTo('path.to.otherState')`.
The `href=true` is an optional touch for `<a>` tags. You can also define your own transitions:
gotoOtherState: function(router, event) {
// Setup? Teardown?
// ...
router.transitionTo('path.to.otherState');
}
Note: if you pass a context in your action helper (e.g. `{{action gotoOtherState this}}`), you can access it via event: `router.transitionTo('path.to.otherState', event.context);`
Update 2: `enter` is a private hook whereas `activate` is a new public hook (see http://emberjs.com/blog/2013/02/15/ember-1-0-rc/)
Problem
Is there a possibility to add custom action (basically any piece of JS code) to the routing event? There is an application which needs to alter some part of the page "outside" of the app. Yes, that part of the page should be in the app, but it's not. So, I need to change the "outside" DOM a little on some routing events. For example, when I'm at the index state, there is an empty element somewhere, when I move to another state, that element changes its content to "Back" and gets active. Also, I would like to bind the ember routing action to onClick event on that element. I tried to find such thing but there seems to be nothing. I found this, but it does not solve my problem at all: How do I bind events directly to existing HTML, without using any kind of views, in Ember.js? Thanks for your time.