Ember.js - 保存记录后如何清除表单数据？

Question

我正在使用Ember App Kit.我有一个带有学生姓名的表单,我可以毫无问题地将数据保存到数据库中.问题是,每当我http://localhost:8000/#/students/new从另一个页面转换回此路径()时,数据(学生姓名)就会保留在表单上.如果我刷新屏幕,那么数据将被清除,我将获得一个新的表格.我究竟做错了什么？

此外,如果我决定不保存或添加记录并去查看学生列表,我会在屏幕上看到一个空记录.但该记录不在数据库中.我怎么能防止这种情况？

//--------------------------------------------
// Controller

var StudentsNewController = Ember.ObjectController.extend({
    init: function() {
        var newSystem = this.store.createRecord('student');
        this.set('newStudent', newStudent);
        this._super();
    },
    actions: {
        acceptChanges: function () {
            var self = this;
            self.get('newStudent').save().then(function(student){
                self.transitionToRoute('students');
            });
        }
    }
});

export default StudentsNewController;

//--------------------------------------------    
// Model

var Student = DS.Model.extend({
    name: DS.attr('string'),
    major: DS.belongsTo('major')

});

export default Student;

//--------------------------------------------    
// Template

    <form  {{action 'updateSystem' on="submit"}}>
        <fieldset>
                <div>
                    <label>Student Name</label>
                    {{input value=newStudent.name size="50"}}
                </div>
                <button {{action 'acceptChanges'}}>Add</button>
        </fieldset>
    </form>

Answer 1

尝试在路由(此处)中设置控制器,而不是使用init控制器中的方法.这是路线责任之一.

我认为问题在于你假设每次转换到 StudentsNewRoutenew都会StudentsNewController被创建,因此init调用该方法.

事实是灰烬一旦创建控制器,并改变它的基础上的内容model和setupController钩.因此init控制器的方法只需调用一次,每次转换到路径时都会得到相同的记录.

要解决这个问题,你可以这样做:

var StudentsNewController = Ember.ObjectController.extend({
    newStudent: null,
    actions: {
        acceptChanges: function () {
            this.get('newStudent').save().then((student) => {
                this.transitionToRoute('students');
            });
        }
    }
});
//--------------------------------------------
var StudentsNewRoute = Ember.Route.extend({

    model: function() {
        return this.store.createRecord('student');
    },

    setupController: function(controller, model) {
        controller.set('newStudent', model);
    },
});

我希望这可以帮助你!