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

Question

我有一个 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

Answer 1

好吧，这是我连续第二次 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 事件将始终被调用，无论您以何种方式离开视图，模型将始终被丢弃。

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

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

ember.js

ember-data

back-button