Hi there, lets say ive got two models: alpha
export default DS.Model.extend({
title: DS.attr('string'),
description: DS.attr('string'),
states: DS.hasMany('state', {
async: true
})
});
and state
export default DS.Model.extend({
title: DS.attr('string'),
description: DS.attr('string'),
});
now ive got the following router:
export default Router.map(function() {
this.route('alphas', function() {
this.route('show', {path: ':alpha_title'}, function() {
this.route('states', function() {
this.route('show', {path: ':state_title'}, function() {
});
});
});
});
});
on my alphas/index-route im loading all alpha-records in the model-hook like that:
index-route
export default Ember.Route.extend({
model: function() {
return this.store.findAll('alpha');
}
});
in my template for alphas/index im using {{link-to}}-helper to navigate to alphas.show like that
{{#each model as |alpha|}}
<li>
{{#link-to 'alphas.show' alpha}}
{{alpha.title}}
{{/link-to}}
</li>
{{/each}}
because of the dynamic segment with :alpha_title I have to override the serialize-hook in the target alphas/show-route
export default Ember.Route.extend({
model: function(params) {
return this.store.find('alpha', { id: params.alpha_title });
},
serialize: function(model) {
return {
alpha_title: model.get('title')
};
}
});
You can also see I was wondering what to do, if im on that route and the browser gets reload. No model-context would be given anymore, because i reached that route not with the link-to helper from above which gives the model, but directly with entering the URL by hand. So thats why im overriding the model-hook with the above (which is simply not working - dont know why), to load the single alpha directly.
My question is…
Is that a good approach to fetch the data or should i never transport modles via link-to helpers (or maybe only with that)? What is the best plan to handle loading models in such a case when accessing dynamic routes manually via URL for example?