使用Ember.js持久保存儿童模型的正确方法是什么?

时间:2013-09-13 18:15:08

标签: ember.js ember-data

问题

我正在教自己Ember并且在坚持我的孩子模特时遇到了问题。这是一个演示问题的JSBin:

http://jsbin.com/OnUXEti/2/edit?html,js,output

如果您使用它,您将能够创建帖子和评论,但只有帖子在页面重新加载后仍然可用。 (我正在使用ember-data和localStorage适配器)


有两种模型类型,PostComment

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

App.Comment = DS.Model.extend({
  message: DS.attr('string')
});

每个帖子都有一系列评论。 我打算在那里有以下网址:

  • /posts将列出所有帖子
  • /posts/1将显示ID为
  • 的帖子
  • /posts/1/comments将显示Post 1的评论

路由的定义如下:

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

我可以毫无问题地将Post模型写入商店。我不能做的是保存评论模型。如果您使用上面的JSBin示例,您将看到可以创建注释,但在重新加载页面时它们不会保留。

我尝试在CommentsController中保存注释:

App.CommentsController = Ember.ArrayController.extend({
    needs: "post",
    post: Ember.computed.alias("controllers.post"),
    newMessage: '',
    actions: {
        create: function() {
            var message = this.get('newMessage');

            var comment = this.store.createRecord('comment', {
                message : message
            });

            this.set('newMessage', '');

            var post = this.get('post');
            var comments = post.get('comments');
            comments.pushObject(comment);
            comment.save();
        }
    }
});

请注意,我使用needs属性获取父Post的句柄。取自documentation about dependencies between controllers

这一切都是错误的,因为它应该是一种常见的情况所以我怀疑我是以非标准的方式设计我的模型或路线。

谢谢, 马特

1 个答案:

答案 0 :(得分:6)

此处的问题是,您需要在将post添加到其comment集合后保存comments。看起来LSAdapter直接在post记录中存储了注释ID数组。

这是一个经过修改的JSBin:http://jsbin.com/OnUXEti/8/edit

注意:我也改变了这个:

post: Ember.computed.alias("controllers.post")

到此:

post: Ember.computed.alias("controllers.post.model")

为了保存您想要处理实际模型的post,而不是控制器。

我还必须更新Ember Data和LSAdapter以使其工作正常,我将hasMany上的comments关系更改为async

comments: DS.hasMany('comment',{async:true})

[更新]:我最初发布了错误的JSBin。正确的是:http://jsbin.com/OnUXEti/8/edit