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

mat*_*rns 5 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')
});
Run Code Online (Sandbox Code Playgroud)

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

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

路由定义如下:

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

我可以毫无问题地将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();
        }
    }
});
Run Code Online (Sandbox Code Playgroud)

请注意,我通过使用needs属性获取父Post的句柄.摘自有关控制器之间依赖关系文档.

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

谢谢,马特

Jer*_*een 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你想要处理的实际模型,而不是控制器.

我也不得不更新灰烬数据和LSAdapter得到的东西的工作,我改变了hasMany对关系commentsasync.

comments: DS.hasMany('comment',{async:true})
Run Code Online (Sandbox Code Playgroud)

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