Ember.js不会自动绑定模型RESTful更改

时间:2013-10-21 10:37:04

标签: javascript rest ember.js ember-data

如果我错了,请纠正我,但我认为Ember应该是大多数模特 - 为你绑定视图? 当您必须手动跟踪模型更改并相应地更新/刷新视图时会出现什么情况?

我正在使用的应用程序拥有与之关联的嵌套路由和模型。

App.Router.map(function() {
    this.resource('exams', {path: "/exams"}, function() {
        this.resource('exam', {path: ":exam_id"}, function(){
            this.resource('questions', {path: "/questions"}, function() {
                this.route("question", {path: ":question_id" });
                this.route("new");
            })
        })
    });
});

一切正常,我可以与其他服务器分开进行考试和提问。

对于每个模型,我都有适当的Ember.ArrayControllerEmber.ObjectController来处理视图中的列表和单个模型项。基本上对于两种模型,我处理事物的方式是IDENTICAL,除了一个嵌套在另一个中的事实。 另一个区别是显示嵌套路线数据我正在使用另一个{{outlet}} - 第一个模板中的那个。

现在的问题是,绑定到视图的顶级模型是由Ember自动处理的,没有任何特殊的观察者,绑定等。 - 例如当我添加新项目时,它会被保存并刷新列表视图以反映更改,或者当项目被删除时,它将自动从视图中删除。 “它只是有效(c)”

对于第二个模型(问题),另一方面,我能够重现所有的crud行为并且它工作正常,但UI不会自动更新以反映更改。

例如,在添加新条目时,我必须这样做(相关行有注释):

App.QuestionsController = Ember.ArrayController.extend({
    needs: ['exam'],
    actions: {
        create: function () {
            var exam_id = this.get('controllers.exam.id')
            var title = this.get('newQuestion');
            if (!title.trim()) { return; }
            var item = this.store.createRecord('question', {
                title: title,
                exam_id: exam_id
            });
            item.save();
            this.set('newQuestion', '');
            this.get('content').pushObject(item); // <-- this somehow important to update the UI
        }
    }
});

虽然它是为我处理的(考试模型)

我做错了什么?如何让Ember.js跟踪和绑定模型并为我更改UI?

1 个答案:

答案 0 :(得分:0)

使用

this.get('content').pushObject(item);

你将你的新问题推到问题控制器阵列。我认为如果你将新问题直接推送到考试has_many关系会更好。

exam = this.modelFor('exam');
exam.get('questions').pushObject(item);