Router: resource() vs route()

What is the difference between resource() and route()? The guides dont really explain this.

Also why doesnt the API documentation for Ember.Router does not show these 2 methods in the list at all?

@trek’s documentation on this is very good. This is the key line which you’ve probably read already:

You should use this.resource for URLs that represent a noun, and this.route for URLs that represent adjectives or verbs modifying those nouns.

The practical difference between these two is that resource may contain other routes, whereas route cannot. Additionally, this.resource automatically creates an index route when it sees you have sub-routes.

App.Router.map(function() {
  this.resource('records', function() {
    // this.route('index') is created automatically in here
    this.route('new');
  });

  this.route('about');
});

While you could always use this.resource and have things work correctly, this.route explicitly creates router leaf states and therefore will lead to a more precise and efficient graph of states for your app.

The reason they don’t appear in the docs for Ember.Router is that they’re actually defined in the separate Ember.RouterDSL module which unfortunately doesn’t have any documentation yet.

10 Likes

Just want to note that this post is no longer applicable to recent versions of Ember. Is that correct? (There seem to be lots of old answers floating around the web, and I think it’d be nice to delete, archive, or at least mark them to avoid confusion. Certain keywords seem to keep them high in search results pages, so I suspect I am not the only one who keeps encountering them.)

Is this Jacob from EmberMN? If so, long time no see! (Ryan here)

Yeah, regular / nested route’s have been the Ember happy path for some time now. Although I’m not sure if resource’s have technically been depreciated/removed yet…

The “old” answers out there are a problem. I know the core team tried to mark many StackOverflow questions as “archived” some time ago, but I’m sure that was a lost cause. The community has also made a couple attempts to provide a way to “version” examples, blog posts, etc. but nothing has stuck. This must be an issue for other projects too, for example all the Angular 1.x examples that’ll no longer apply in Angular 2.x.