Question

I have this route part, /articles/. I would like to create subroutes here, like / and /list/. This is how I am trying:

articles: Ember.Route.extend({
    route: '/admin/articles',
    index: Ember.Route.extend({
        route: '/',
        connectOutlets: function (router, context) {
            "use strict";
            router.get('applicationController').connectOutlet('toolbar', 'articlesToolbar');
            router.get('applicationController').connectOutlet('main', 'articles');
        }
    }),
    list: Ember.Route.extend({
        route: '/list/',
        connectOutlets: function (router, context) {
            "use strict";
            router.get('applicationController').connectOutlet('toolbar', 'articlesToolbar');
            router.get('applicationController').connectOutlet('main', 'articles');
        }
    }),
    doLogout: function(router, context) {
        "use strict";
        router.transitionTo('login', context);
    }
}),

i must be doing something wrong, because it does not transition to the articles route. This is my routing log:

STATEMANAGER: Sending event 'doSidebar' to state root.
STATEMANAGER: Entering null
STATEMANAGER: Entering root
STATEMANAGER: Entering root.articles
STATEMANAGER: Sending event 'doSidebar' to state root.
STATEMANAGER: Entering null
STATEMANAGER: Entering root
STATEMANAGER: Entering root.media

But the articles url is not registered to the history — if I click back, I get to the previous state, the one before articles.

What am I doing wrong?

Answer 1

You cannot route to non-leaf states, so you cannot transition to ‘articles’.
Either add initialState: 'index' to your articles route or change your code to transition to 'articles.index'

articles: Ember.Route.extend({
  route: '/admin/articles',
  initialState: 'index',
  index: Ember.Route.extend({
    //