Ember.js订单有很多孩子 [英] Ember.js order hasMany children

问题描述

我有一个项目模型，每个项目可以有很多项目。这可以是很多级别。

我有这个jsfiddle http://jsfiddle.net/rmossuk/xmcBf/3/

如何更改这个以便能够拥有多个级别的项目，还有如何循环下来显示每个级别？

我还需要能够为每个项目孩子订购并将该订单存储到服务器。

请任何人告诉我如何做到这一点？

更新：

我现在已经设法实现了这个项目可以在很多层次深度这个问题看到这里 http://jsfiddle.net/rmossuk/fBmmS/3/

但是，我需要一种方式来说明每个孩子并按照这些顺序显示它们。目前它只显示来自itemIds数组的子项目，但这只是用于关联目的，我不能改变这个来重新排序我可以吗？

任何人知道如何做到这一点？

非常感谢
rick

解决方案>

在视图中，使用 sortedItems 计算属性，定义如下：。

JS

  App.Item = DS.Model.extend（{
 name：DS.attr（'string'），
 index：DS.attr（'number'），
 items：DS.hasMany（'App.Item'，{key：'itemIds' }），
 item：DS.belongsTo（'App.Item'），
 product：DS.belongsTo（'App.Product'），
 
 sortedItems：function（） {
 var items = this.get（'items'）。toArray（）; 
 return items.sort（function（lhs，rhs）{
 return lhs.get（'index' -  rhs.get（'index'）; 
}）; 
} .property（'items。@ each.isLoaded'）
}）; 
  

请在这里查看完整的解决方案： http://jsfiddle.net/MikeAski/K286Q/3/

---

编辑

根据您的要求，这里是另一种解决方案，在父母内部（以最小化更新和索引管理）： http://jsfiddle.net/MikeAski/K286Q / 12 /

JS

  App.Item = DS.Model.extend（{
 name：DS.attr（'string'），
 items：DS.hasMany（'App .Item'，{key：'itemIds'}），
 sortedIds：DS.attr（'string'，{key：'sortedIds'}），
 item：DS.belongsTo（'App.Item '），
 product：DS.belongsTo（'App.Product'），
 
 sortedChildren：function（）{
 if（！this.get（'isLoaded'）） {
 return []; 
} 
 var sortedIds = this.get（'sortedIds'）。split（'，'），
 items = this.get（'items'）toArray（）; 
 return sortedIds.map（function（id）{
 if（id ===''）{
 return null; 
} 
 return items.find （item）{
 return item.get（'id'）== id; 
}）; 
}）。filter（function（item）{
 return !! item ; 
}）; 
} .property（'isLoaded'，'sortedIds'，'items。@ each.isLoaded'）
}）; 
  

有点复杂，但是...

I have a item model and each item can have many items. This can be many levels deep.

I have this jsfiddle http://jsfiddle.net/rmossuk/xmcBf/3/

how do I change this to be able to have multiple levels of items and also how do I loop down each level to display them ?

I also need be able to order each items children and store that order to persist to server.

please can anyone show me how you can do this ?

UPDATE:

I have now managed to implement the Items can be many levels deep bit of this problem see here http://jsfiddle.net/rmossuk/fBmmS/3/

But i need a way to state the order of each items children and to display them in that order. At the moment it just displays the children items from the itemIds array but this is only used for association purposes and i cant change this to re-order can i ??

Anyone know how to do this ?

Thanks a lot rick

解决方案

In the views, use a sortedItems computed property, defined as follow:.

JS

App.Item = DS.Model.extend({
  name: DS.attr('string'),
  index: DS.attr('number'),
  items: DS.hasMany('App.Item', {key: 'itemIds'} ),
  item: DS.belongsTo('App.Item'),
  product: DS.belongsTo('App.Product'),

  sortedItems: function () {
    var items = this.get('items').toArray();
    return items.sort(function (lhs, rhs) {
      return lhs.get('index') - rhs.get('index');
    });
  }.property('[e-mail]')
});

See a full working solution here: http://jsfiddle.net/MikeAski/K286Q/3/

---

EDIT

According to your request, here is another solution, keeping the sorted ids inside the parent (to minimize updates & indexes management): http://jsfiddle.net/MikeAski/K286Q/12/

JS

App.Item = DS.Model.extend({
  name: DS.attr('string'),
  items: DS.hasMany('App.Item', {key: 'itemIds'} ),
  sortedIds: DS.attr('string', { key: 'sortedIds' }),
  item: DS.belongsTo('App.Item'),
  product: DS.belongsTo('App.Product'),

  sortedChildren: function () {
    if (!this.get('isLoaded')) {
      return [];
    }
    var sortedIds = this.get('sortedIds').split(','),
        items = this.get('items').toArray();
    return sortedIds.map(function (id) {
      if (id === '') {
        return null;
      }
      return items.find(function (item) {
          return item.get('id') == id;
      });
    }).filter(function(item) {
      return !!item;
    });
  }.property('isLoaded', 'sortedIds', '[e-mail]')
});

A little bit more complicated, nevertheless...

这篇关于Ember.js订单有很多孩子的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！