Question

我有一个带有数据模型的ember应用程序以及用于列出和添加新项目的常用CRUD视图/路径/控制器。

当我点击“添加新的＆＃39;从索引页面，我得到了预期的表格，并且＆＃39;保存＆＃39;和＆＃39;取消＆＃39;纽扣。如果我按下取消，视图将返回到索引视图，并且不会按预期保存模型。

这是新项目控制器的代码：

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');
    },
  },
});

但是，如果按下后退按钮，我也会在索引页面中结束，但索引列表中会出现一个额外的空行，对应于未保存在“＆＃39; new”中的新记录。视图。此记录未持久保存到数据层，但它仍以某种方式存在于内存中，this.store.find('items')返回包含它的集合。如果我刷新页面，空白行将消失。此外，如上所述，如果我使用取消按钮退出表单，则会丢弃该记录，因为在“取消”按钮中动作方法我调用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

嗯，这是我连续第二次发布到stackoverflow并且我很快就找到了答案，所以我想我应该避免在这里问，除非我真的无能为力和无望;）

感谢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-data未保存的模型

1 个答案: