使用Ember.js加载属于父模型的数据 [英] Load data belonging to a parent model with Ember.js

问题描述

考虑类似于此处的示例：

App.Router.map(function() {
  this.resource("posts", function() {
    this.resource("post", { path: "/posts/:post_id" }, function() {
      this.resource("comments", { path: "/comments" });
    });
  });
});

使用 DS.RESTAdapter 。当我访问 PostsRou​​te 时，路由器将加载所有帖子，并调用API URL / posts 。

using the DS.RESTAdapter. The Router would load all the posts when I access the PostsRoute with a call to the API URL /posts.

当我访问 PostRoute 时，例如，使用 id = 1 ，它不会再次触发API，即它不会触发 / post / 1 。

When I then access PostRoute, for example for the post with id=1, it doesn't hit the API again, i.e. it doesn't hit /post/1. It loads the post from the store.

我想要访问 CommentsRou​​te 发布与 ID = 1 。我如何加载评论？

I want then to access CommentsRoute for post with id=1. How do I load the comments?

首先我应该加载所有评论，当我加载帖子列表？在这种情况下，我需要加载所有帖子的所有评论。是否可以在需要时加载评论，即当我访问 CommentsRou​​te ？

Should I have sideloaded all the comments in the first place, when I loaded the post list? In this case though, I would need to load all the comments for all the posts. Is it possible to load the comments only when needed, i.e. when I access CommentsRoute?

在这种情况下，如何我是否真的从后端加载评论？
具体来说，当我访问实际显示的页面时，如何编写 CommentsRou​​te 来加载RESTful API中的注释？

In this case, how do I actually load the comments from the backend? Specifically, how do I write the CommentsRoute to load the comments from the RESTful API when I access the page that actually displays them?

我想有一个需要如下：

App.Post = DS.Model.extend({
  comments: DS.hasMany('comment')
});

App.Comment = DS.Model.extend({
  post: DS.belongsTo('post')
});

App.CommentsRoute = Ember.Route.extend({
  model: function() {
    /*
     * How do I inject params.post_id here
     * to make a request to the RESTful API?
     * Which URL would be called?
     * /comments?post_id=ID
     * /post/post_id/comments
     * ...
     */

    // Doesn't work, hits /comments
    return this.store.find('comment', { post_id: params.post_id });
  }
});

为什么

return this.store.find('comment', { post_id: params.post_id });

点击 /评论？

推荐答案

您只需要声明您的 CommentsRou​​te ，如下所示：

You just need to declare your CommentsRoute like this:

App.CommentsRoute = Ember.Route.extend({
  model: function() {
    return this.modelFor('post').get('comments');
  }
});

它的作用是获得 PostRoute 并获取其注释。

What it does is, it gets the model of the PostRoute and fetches its comments.

Ember数据处理其背后的逻辑。如果意见是负载的，那么只会返回这些。否则，它将发出GET请求来获取它们。

Ember-data handles the logic behind it. If comments were sideloaded, it will just return these. Otherwise it will issue a GET request to fetch them.

为此，您需要包含链接属性在序列化的帖子。 链接属性需要包含您希望使用ember数据的URL才能获取注释。

For this to work, you need to include the links property on a serialized post. The links property needs to include the URL you wish ember-data to use in order to fetch the comments.

例如您的序列化帖子可能如下所示：

E.g. your serialized post may look like this:

{
  "post": {
    "id": 1,
    "title": "Rails is omakase",
    "links": { "comments": "/posts/1/comments" }
  }
}

请参阅 DS.RESTAdapter＃findHasMany 。

hasMany 关系可能需要声明为异步，以使其正常工作：

The hasMany relationship probably needs to be declared async for this to work properly:

App.Post = DS.Model.extend({
  comments: DS.hasMany('comment', { async: true })
});

这篇关于使用Ember.js加载属于父模型的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！