model and setupController hook with undefined model
ember.js, routes
Solution
I have the feeling that I'm somehow setting the content of the model wrong, but can't figure it out.
What your doing is not wrong per-se. If you need ember router to wait for model ajax to complete before moving on to setupController hook your model's find() should return a promise. If a route's model hook returns a promise, ember router will wait for the promise to be resolved before moving on.
By default ember-data's model objects return a promise when you call find({}). It should be easy to do the same for your model, see this Ember initializing route model with query for an example of the deferred patter.
This only happens by the way if I use the back and forward button to navigate. If I go in the route through an #linkTo with the object specified everything works as expected.
Makes sense. When you use a #linkTo the data is already loaded.
Problem
I have a `setupController` and `model` hook in my route. The model.find(param) holds a ajax call to the rails backend. What happens is that my model hook fires and calls to the backend. But before the backend answers and the success callback actually comes back with the model, the `setupController` hook fires with a model that is still undefined. End result is that while the model itself is being updated through the binding system, the additional setup that needs to take place in the setupController is not working. I have the feeling that I'm somehow setting the content of the model wrong, but can't figure it out. This only happens by the way if I use the back and forward button to navigate. If I go in the route through an `#linkTo` with the object specified everything works as expected. The code I have is below, if somebody has an idea that would be great. ``` App.ProjectsEditRoute = Ember.Route.extend({ model: function(params) { return App.Project.find(params.project_id); }, setupController: function(controller, model) { this.controllerFor('activedataset.index').set('content', App.ActiveDataSet.findAll(model.id)); } }); App.Project = Ember.Object.extend({ id: '', name: '' }); App.Project.reopenClass({ findAll: function() { var result = Ember.ArrayProxy.create({content: []}); var self = this; $.ajax({ url: '/projects.json', type: 'GET', data: {'user_id': App.currentUser.id}, success: function(data, textStatus, xhr) { result.set('content', data.projects); }, error: function(xhr, textStatus, errorThrown) { alert('error'); } }); return result; }, find: function(project_id) { var result = Ember.Object.create({content: null}); var self = this; $.ajax({ url: '/projects/' + project_id + '.json', type: 'GET', success: function(data, textStatus, xhr) { result.setProperties(data.project); }, error: function(xhr, textStatus, errorThrown) { alert('not found'); } }); return result; } }); ``` Edit after solution provided by Mike: ``` App.ProjectsEditRoute = Ember.Route.extend({ model: function(params) { var record = App.Project.find(params.project_id); var promise = Ember.Deferred.create(); record.addObserver('isLoaded', function() { promise.resolve(record); }); return promise; }, setupController: function(controller, model) { this.controllerFor('activedataset.index').set('content', App.ActiveDataSet.findAll(model.id)); } }); App.Project.reopenClass({ find: function(project_id) { var result = Ember.Object.create({content: null, isLoaded: false}); var self = this; $.ajax({ url: '/projects/' + project_id + '.json', type: 'GET', success: function(data, textStatus, xhr) { result.setProperties(data.project); result.set('isLoaded', true); }, error: function(xhr, textStatus, errorThrown) { alert('not found'); } }); return result; } }); ```