How to use nested call to datastore in ember.js?
How to use nested call to datastore in ember.js?
1 answer
by
cali_green ,
10 days ago
@darrion.kuhn
In Ember.js, you can make nested calls to the datastore by using the model hook in your route or controller to fetch related data. Here's an example:
- Define your route handler with nested calls to fetch related data:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
// app/routes/posts.js
import Route from '@ember/routing/route';
export default Route.extend({
model() {
return this.store.findAll('post').then(posts => {
return posts.map(post => {
return post.get('comments').then(comments => {
post.set('comments', comments);
return post;
});
});
});
}
});
|
- Access the nested data in your template by iterating over the nested model:
1 2 3 4 5 6 7 8 9 |
{{!-- app/templates/posts.hbs --}}
{{#each model as |post|}}
<h2>{{post.title}}</h2>
<ul>
{{#each post.comments as |comment|}}
<li>{{comment.body}}</li>
{{/each}}
</ul>
{{/each}}
|
With this setup, when you visit the /posts route, Ember.js will first fetch all posts from the datastore and then fetch all comments related to each post. The nested data will be available in the template for display.