Ember.js: Howto create routes that only execute code

问题

My app has a main view with some hidden elements that can be activated by the user. Like a typical sidebar on mobiles that slides in from the left. Or a cart that reveals the details when you tap on it.

The information in those initially hidden elements is always up to date since their content is mapped in the main app template. So my routes would not need to render any DOM.

The transitions are JS based. But now I want those states to be reflected in the URL, in order to get a consistent back button behavior.

How can I achieve that using the ember framework?

Update to make it more clear, what I am talking about:

To my understanding triggering routes in ember has mainly two side-effects:

Represent the new state in the URL, enabling consistent browser history support.
Render templates that manipulate the DOM based on some data

In my case, when for instance a user taps on the minimized cart I need:

Represent the new state in the URL, enabling consistent browser history support.
Execute my showCart() JS Function (no DOM changes, no template rendering)

When the user now taps on the browser back button, closeCart() should be executed (based on the fact that the state in the URL carries the information that the cart is open).

回答1:

You can use the activate and deactivate methods from your show route, to know when is entered or exited from your route:

App.ShowRoute = Ember.Route.extend({
    activate: function() {
        alert('Entering in show');
        // here would be your showCart
    },
    deactivate: function() {
        alert('Exiting from show');
        // and here the closeCart
    }
});

I created a live demo here, to you see this working.

回答2:

The problem is, where can they access these slide in windows? Can they only be accessed from a single location in your route map? Or can the user click on it regardless of whatever view they are in? And if they click it from different views, do you move them back to a different route just to pop out some slide in window?

If they can only click it from one place, then you could just add code in your setupController of that specific route to fire the js to slide out the window.

 setupController: function(){
   Ember.run.scheduleOnce('afterRender', this, function(){
    //run some js to slide out the window
    });
 }

Honestly if they can click a button anywhere and have the slide out appear, I wouldn't try putting it into the url. Just my opinion though.

来源：https://stackoverflow.com/questions/18111466/ember-js-howto-create-routes-that-only-execute-code

标签

javascript

ember.js

transitions