Question

我在从Ember.JS模型中删除记录时遇到问题。

我概述了我的车把模板中的记录，每行有一个删除按钮。

单击按钮时，我想从表中删除该行（并在我的REST API上执行DELETE）。

我的车把模板包含每张记录的下表+删除按钮。

<table class="table table-hover">
  <tr>
    <th>Latitude</th>
    <th>Longitude</th>
    <th>Accuracy</th>
    <th></th>
  </tr>
  {{#each model}}
    <tr>
    <td>{{latitude}}</td>
    <td>{{longitude}}</td>
    <td>{{accuracy}}</td>
    <td><button {{action removeItem this target="view"}}>Delete</button></td>
    </tr>
  {{/each}}
</table>

我的观点看起来像这样

App.LocationsIndexView = Ember.View.extend({
    removeItem: function(location) {
      this.get('controller').send('removeItem', location);
    }
 });

我的控制器看起来像这样：

App.LocationsIndexController = Ember.ArrayController.extend({
  removeItem: function(location) {
    console.log("Removing location " + location);

    location.one("didDelete", this, function() {
      console.log("record deleted");
      this.get("target").transitionTo("locations");
    });

    location.deleteRecord();
    this.get("store").commit();
  }
});

调用removeItem方法，从表中删除该项，并在REST API上调用DELETE。好极了！

然而......

如果我切换到另一个模板（使用linkTo）并返回概览表（再次使用linkTo），则删除的记录将重新显示在表格中。它不再出现在后端，因此无法再次删除：

Uncaught Error: Attempted to handle event `deleteRecord` on <App.Location:ember356:517d96d7658c51de1c000027> while in state rootState.deleted.saved. Called with undefined

我已经浏览了导游，但他们强迫你跳到这个地方。 http://emberjs.com/guides/views/看起来很有前途（实际上显示了我想要实现的删除按钮），只是为了继续完全不同的东西。

我想了解为什么删除的项目会重新出现以及如何避免这种情况。我也尝试在ArrayController中调用this.removeObject（location），但删除的记录会不断重新出现。

我可以使用浏览器控制台重现此问题

locs = App.Location.find（）;
locs.content.length //返回5
newLoc = App.Location.createRecord（{纬度：120，经度：120}）
locs = App.Location.find（）;
locs.content.length //返回6
newLoc.deleteRecord（）
locs.content.length //返回5
locs = App.Location.find（）;
locs.content.length //返回6（为什么它在这里返回6？）

Answer 1

此问题是由于ember.js / ember-data.js中的错误或2之间的兼容性问题引起的。

当我从builds.emberjs.com网站上获取最新的一对余烬和余烬数据时，问题就解决了。

使用此组合，删除工作正常，

locs = App.Location.find（）;
locs.content.length //返回5
newLoc = App.Location.createRecord（{纬度：120，经度：120}）
locs = App.Location.find（）;
locs.content.length //返回6
newLoc.deleteRecord（）
locs.content.length //返回5
locs = App.Location.find（）;
locs.content.length // 现在返回5，因为它应该在此返回之前6

因此，在使用ember-data时，请始终确保它与您正在使用的ember.js兼容。在http://builds.emberjs.com上发布最新版本的ember和ember-data的EmberJS持续集成应该通过他们的测试套件，应该被认为是兼容的。

EmberJS CRUD：在linkTo之后，deletedRecord不断重新出现

1 个答案: