Reputation: 2737
What is the best way to load multiple models sequentially in Ember JS?
e.g.
App.ProductRoute = Ember.Route.extend({
model: function(params) {
// first call
this.store.find('Product');
// second call should only be called after the first find is completed
var prod = this.store.find('Product', params.product_id);
// third call should only be called after the above is completed
this.store.find('ProductOptions', prod.get('optionId');
return ???
},
setupController: function(controller, model){
// how would one the set up the controllers?
}
});
This post shows how to load multiple models in a route at the same time.
Upvotes: 2
Views: 402
Reputation: 47367
You can create your own promise, and resolve a hash. That will be the model in the controller, no need to override setupController
unless you want them stored on the controller somewhere different.
App.ProductRoute = Ember.Route.extend({
model: function(params) {
var self = this;
return new Em.RSVP.Promise(function(resolve, reject){
// first call
self.store.find('Product').then(function(products){
// second call should only be called after the first find is completed
self.store.find('Product', params.product_id).then(function(product){
// third call should only be called after the above is completed
self.store.find('ProductOptions', product.get('optionId').then(function(productOption){
resolve({
products:products,
product:product,
productOptions:productOptions
});
});
});
});
});
}
});
BTW, it sounds like product options should be an async relationship on the product.
Upvotes: 3