ember-使用后退按钮导航回来时,数据未保存的模型不会被丢弃

ember-data unsaved model is not discarded when navigating back with the back button

我有一个 ember 应用程序,带有数据模型和常用的 CRUD views/routes/controllers 用于列出和添加新项目。

当我从索引页面单击 'add new' 时,我得到了预期的表单,其中包含 'Save' 和 'Cancel' 按钮。如果我按取消,视图将返回到索引视图,并且不会按预期保存模型。

这是新物品控制器的代码:

App.ItemsNewController = Ember.ObjectController.extend({
  actions: {
    saveChanges: function() {
      this.model.save();
      this.transitionTo('items');
    },
    cancel: function() {
      this.model.rollback(); // how to run this when the back button is pressed?
      this.transitionTo('items');
    },
  },
});

但是如果我按下后退按钮,我也会进入索引页面,但是索引列表中会出现一个额外的空行,对应于 'new' 视图中未保存的新记录.这条记录没有持久化到数据层,但它仍然存在于内存中,this.store.find('items') returns 一个包含它的集合。如果我刷新页面,空白行就会消失。另外,如上所述,如果我使用取消按钮退出表单,记录将被丢弃,因为在 'cancel' 操作方法中我调用了 this.model.rollback().

所以最重要的是,我想我必须在按下后退按钮时回滚模型,但据我所知没有路由回调可以将一些代码挂接到此事件。

如果它很重要,我正在使用 Ember 1.9.1,Ember Data 1.0.0-beta.15-canary,Handlebars 2.0.0,jQuery 1.10 .2

好吧,这是我连续第二次 post 访问 Whosebug 并且我很快就找到了答案,所以我想我应该避免在这里提问,除非我真的毫无头绪和绝望; )

感谢this other question,我发现路线上有一个exit事件。所以解决这个问题的关键是在路由上,而不是在控制器上。我最终将模型回滚放在路由的退出事件方法中,如下所示:

更新: @NicholasJohn16 指出最好使用 deactivate 挂钩,而不是 exit。请参阅下面的评论中的详细信息。代码示例已相应更改。

App.ItemsNewRoute = Ember.Route.extend({
  model: function() {
    return this.store.createRecord('item', {
      title: 'Untitled',
      status: 'new',
    });
  },
  deactivate: function() {
    model = this.controllerFor('notifications.new').get('model');
    model.rollback();
  },
});

完成此操作后,您甚至可以从控制器中的取消操作中删除 model.rollback() 调用,只保留 transitionTo('items') 调用。由于路线的 deactivate 事件将始终被调用,无论您以何种方式离开视图,模型将始终被丢弃。