Set resource index as default route

1

I have a single resource defined,

Router.map(function() {
  this.resource('books', function() {
    this.route('new');
    this.route('show', {path: ':book_id'});
    this.route('edit', {path: ':book_id/edit'});
  });
});

When a user navigates to the default route, /, I want the books index route to show.

Currently, I have an application and index template defined. The application template is defined as

<h1>Welcome to Books</h1>
{{link-to 'Home' 'index'}}
{{link-to 'Books' 'books'}}
{{outlet}}

I want the books index page to output within {{outlet}}.

I think I should override the default route within my router.js file, but the few ways I have tried have thrown exceptions for an unknown index.index.

How should I define the / default router to render the books index template?

2

I may have already found the answer. I think I want to override the default behavior of / by creating an Ember.Route subclass.

From docs,

App.IndexRoute = Ember.Route.extend({
  beforeModel: function() {
    this.transitionTo('posts');
  }
});

In my example, I would replace this.transitionTo('posts'); with this.transitionTo('books');

Scanned the docs a few times last night, but must have passed over this.

3

I’ve never done this personally, but you could also define the path for the books resource.

Route.map(function() {
    this.resource('books', { path: '/' }, function() {
        ...
    });
});

If that doesn’t work, you might want to use the redirect hook instead of the beforeModel hook. It’s a bit more semantic, and I believe each of them has slightly different functionality in terms of side-effects.

4

Great suggestion. I actually tried that last night, but without success. When I define,

Router.map(function() {
  this.resource('books', {path: '/'}, function() {
    this.route('new');
    this.route('show', {path: ':book_id'});
    this.route('edit', {path: ':book_id/edit'});
  });
});

I get Error while loading route: undefined in the js console and a blank index page. Possible that I have something messed up somewhere else in the code. For now, overriding the default index using App.IndexRoute is working great.

I will review the differences between beforeModel and redirect. Thanks!

5

Did you figure this out? I remember the Fire Up Ember screencast doing something similar.

6

Thanks, Sam. Yes, I figured it out.

7

How did you figure this out? Thanks!

8

I have spent a fair amount of time frustrated with Error while loading route: but most of the time, it’s that I had changed the route while the server was running – and now that route/urls I’m at isn’t there. So it’s correct. Then I type in the new corresponding URL or click to get there etc / and things are as they should be. So… check that out (future readers) because you may not be doing anything wrong / except being on the route that you just changed… and no longer exists) : )