Can EmberJS support default load of substate

Question

I have state like

mysite.com/#/index This is the default page loaded on initilization

There are other subroutes mysite.com/#/about mysite.com/#/contact

If someone types mysite.com/#/about Can I control the loading of substate about ?

Answer 1

The Ember Router does this automatically, as long as you have defined routes (URLs) in your Router.

Something like the following will automatically navigate to the correct state when the URL mysite.com/#/about is entered. If you want to control what happens when that state is entered and exited, specify this inside the enter() and exit() functions.

App.router = Ember.Router.create({
    enableLogging: true,
    //location: 'history',
    root: Ember.Route.extend({
        home: Ember.Route.extend({
            route: '/',
            redirectsTo: 'index'
        }),
        index: Ember.Route.extend({
            route: '/index',
            connectOutlets: function (router) {
                router.get('applicationController').connectOutlet('index');
            }
        }),
        about: Ember.Route.extend({
            route: '/about',

            enter: function() {
                //stuff
            }

            exit: function() {
                //stuff
            }

            connectOutlets: function (router) {
                router.get('applicationController').connectOutlet('about',);
            }
        })
    })
});