Ember.js dynamic routing

Question

I am trying to build an application with Ember.js, with routing, roles, login, logout, and all. My problem right now is that I cannot figure out how to deal with dynamic routing.

What I need, is to be able to use one route for sidebar navigation.

When the user logs in, he/she will get to the dashboard view. Say they click Post menu on the left, then they will see a posts view. I want to deal with these in the same route, something like /:module/.

module: Ember.Route.extend({
   route: '/admin/:module/',
   doLogout: Ember.Route.transitionTo('login'),
   connectOutlets: function (router) {
      "use strict";
      router.get('applicationController').connectOutlet('sidebar', 'sidebar');
      router.get('applicationController').connectOutlet('toolbar', 'toolbar');
   }
})

This is where I need a bit of help. How does the dynamic routing work exactly? Probably the only thing I found so far is @wycats' gist on ROuting here, but I could not figure it out from there: https://gist.github.com/2728699

did you take a look at github.com/emberjs/ember.js/blob/master/packages/ember-routing/… — sabithpocker
– sabithpocker, Commented Aug 29, 2012 at 0:43
I didn't. I will now. Since I asked the question, I found out that I have to use serialize/deserialize, but just did not have the needed time to try it. — eduard
– eduard, Commented Aug 29, 2012 at 9:28
I got back to this, tried sorting up things for a few hours, but with no success. I ended up giving up dynamic routing combined with named outlets, because I could not get it to work. If anybody does have such an example, it would be welcome. — eduard
– eduard, Commented Sep 2, 2012 at 22:53

sabithpocker · Accepted Answer · 2012-09-03 01:51:27Z

1

Here is a stripped down piece of a dynamic routing I used:

myroute : Em.Route.extend({
    route : '/myroute/:tid', //tid is same as index of Object
    deserialize: function(router, params) {
        return App.router.getPath('myController.content').objectAt(parseInt(params.tid));
                    //you can use some other parameters than tid and find the coresponding element
        },
    serialize: function(router, context) {
        return {
        tid: App.router.getPath('myController.content').indexOf(context)
        }
        },
    connectOutlets: function(router, context) {
        var currentController = router.get('currentController');
        currentController.connectOutlet({
            name : 'controllername',
            outletName : 'outletname',
            context: context
            }); 
        },
    index: Em.Route.extend({
        route : '/'
        })
    }),

Here is a Gist explaining Connect Outlets chack current source codes for latest updates https://gist.github.com/3606155

answered Sep 3, 2012 at 1:51

sabithpocker

15.6k1 gold badge44 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

eduard Over a year ago

Thx for that, I'll give it another try sometime and get back here with my story.

Collectives™ on Stack Overflow

Ember.js dynamic routing

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related