Question

我已经在Ember.js上关注了PeepCode教程，并且正在扩展它以从选项卡中删除项目。我还在服务器上实现一个简单的RESTful接口来持久化更改，并使用DS.RESTAdapter。

有2个相关模型：

TabItem的
Tab，与TabItem具有hasMany关系

继续本教程之后，我添加了一个简单的删除链接到标签模板：

<script type="text/x-handlebars" data-template-name="tab">
  <ul id="customer-tab">
    {{#each tabItem in tabItems}}
    <li>
      <h3><a href="#" {{ action "removeTabItem" tabItem }}>x</a> {{ tabItem.food.name }} <span>{{ money tabItem.cents}}</span></h3>
    </li>
    {{ else }}
      <li><h3>Click a food to add it</h3></li>
    {{/each}}
    <li id="total">
      <h3>Total <span>{{ money cents }}</span></h3></li>
    </li>
  </ul>
</script>

在控制器中

App.TabController = Ember.ObjectController.extend({
  removeTabItem: function(tabItem) {
    var store = this.get('store');
    store.transaction();
    var t = store.find(App.TabItem,tabItem.get('id'));
    t.deleteRecord();
    this.get('tabItems').removeObject(tabItem);
    store.commit();
  }
});

上面的控制器代码我做了一些试验＆amp;错误＆amp;猜测。 “removeObject”调用似乎是从用户界面正确删除项目所必需的，并且“deleteRecord”调用似乎是必要的，因此“commit”将导致对服务器的DELETE调用。

控制器代码似乎有点啰嗦，我怀疑我错过了一些东西。有没有一种被认为更好的方法，可能更直接地使用“tabItem”，并使用更少的API调用？

Answer 1

回答我自己的问题：

该行：

var t = store.find(App.TabItem,tabItem.get('id'));

只是不必要，我可以使用传递给方法的tabItem。所以我的TabController现在是：

App.TabController = Ember.ObjectController.extend({
  removeTabItem: function(tabItem) {
    var store = this.get('store');
    store.transaction();
    tabItem.deleteRecord();
    store.commit();
  }
});

Tab模型与TabItem有“hasMany”关系，但没有自动关系，所以当TabItem改变（或被删除）时，我怀疑Tab没有“知道” “删除TabItem后重绘自己”。向TabItem添加“belongsTo”关系似乎可以对此进行排序。
```
App.TabItem = DS.Model.extend({
  tab: DS.belongsTo('App.Tab'),
  cents: DS.attr('number'),
  food: DS.belongsTo('App.Food')
});
```

Ember.js推荐的方法从集合中删除项目并坚持REST

1 个答案: