Ember Routing - Model hook not called on page refresh - ember.js

Question

I am trying to use nested routing to render a collection first. Once the collection is rendered, clicking on an item (using link-to) renders that particular item in the outlet. This all works fine so far.
I am having a problem where refreshing the page doesn't call the 'model' hook of my nested resource though.
From Ember's website at http://emberjs.com/guides/routing/specifying-a-routes-model/:
What happens if the user visits your application directly with a URL
that contains a dynamic segment? For example, they might reload the
page, or send the link to a friend, who clicks on it. At that point,
because we are starting the application up from scratch, the actual
JavaScript model object to display has been lost; all we have is the
ID from the URL.
Luckily, Ember will extract any dynamic segments from the URL for you
and pass them as a hash to the model hook as the first argument
Here is my code:
Admin.Workqueues.App.Router.map(function () {
this.resource('delinquencies', function () {
this.resource('delinquency', {
path: '/:id'
});
});
});
Admin.Workqueues.App.DelinquenciesRoute = Ember.Route.extend({
model: function () {
// Does XHR here and fetches a collection of items to render.
// Returns a promise
}
});
Admin.Workqueues.App.DelinquencyRoute = Ember.Route.extend({
model: function (params) {
debugger; // This doesn't get called
}
});
So with this code, going to /delinquencies lists the entire collection. Clicking on an item opens a delinquency object at /delinquencies/3 but now refreshing the page doesn't call the model hook of delinquency route.
I am not sure what I am missing. Any ideas? If it matters, I am using:
Ember : 1.2.0
Ember Data : 1.0.0-beta.7+canary.f482da04
Handlebars : 1.1.1

Answer 1

You shouldn't define the resource as a child resource but as a separate one.
Admin.Workqueues.App.Router.map(function () {
this.resource('delinquencies', function () {});
this.resource('delinquency', { path: '/:delinquency_id' });
});
The reason your code works right now is because the link-to helper already provides the context so the model hook never gets called.
For the model hook in the DelinquencyRoute you should use something like this:
return this.store.find('delinquency', params.delinquency_id);
For more info, have a look at the guides and getting started tutorial:
http://emberjs.com/guides/routing/defining-your-routes/ (the dynamic segments section answers your question)