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

Posted 2023-02-26

【中文标题】Ember.js 不会自动绑定模型 RESTful 更改

【英文标题】：Ember.js does not auto bind model RESTful changes

【发布时间】：2013-10-21 10:37:03

【问题描述】：

如果我错了，请纠正我，但我认为 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.ArrayController 和Ember.ObjectController 来处理视图中的列表和单个模型项。基本上对于这两种模型，我处理事物的方式是相同的，除了一个嵌套在另一个中。 另一个区别是，为了显示嵌套的路线数据，我使用了另一个 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】：

有

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

您将新问题推送到问题控制器数组。我认为如果您将新问题直接推送到考试 has_many 关系会更好。

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