通过sortProperty mixin对由Ember-Data支持的ArrayController进行排序

Question

我希望能够对其ArrayController内容来自余烬数据查询进行排序.不幸的是,sortPropertymixin在这种情况下似乎不起作用.

我希望能够做到以下几点:

App = Ember.Application.create();
App.store = DS.Store.create({ revision: 4});

App.Item = DS.Model.extend({
    id: DS.attr('string'),
    name: DS.attr('string')
});

App.store.createRecord(App.Item, {id: '4', name: 'banana' });
App.store.createRecord(App.Item, {id: '2', name: 'apple'});
App.store.createRecord(App.Item, {id: '6', name: 'spaghetti'}); 

App.ItemsController = Ember.ArrayController.create({
    content: App.store.findAll(App.Item),
    sortProperties: ['name']
});

使用最新版本的EmberEmber-data,这给出了输出:

[ id: 4, name: banana ]

[ id: 2, name: apple ]

[ id: 6, name: spaghetti ]

这里的问题是App.store.findAll()返回一个RecordArray内容属性不仅仅是一个App.Item实例数组(在这种情况下,内容是[2,3,4])

为了实际掌握实例,我需要使用类似的东西objectAt().但即使我从中提取App.Item实例RecordArray并将它们转储到普通数组中,事情也无法按预期工作.

我错过了显而易见的方法吗,或者这只是框架的现状？我宁愿不必将我的所有模型复制为普通对象,只是为了对它们进行排序.

编辑:

我通过自己的习惯解决了这个问题ArrayController.如果事情如上所述,那将会很好.

编辑#2:

原始车把模板:

<script type="text/x-handlebars">
    {{#each App.ItemsController.content }}
        <p>[ id: {{id}}, name: {{name}} ]</p>
    {{/each}}
</script>

(另外,我使用过sortProperty属性而不是sortProperties上面的代码,但这只是一个错字.)

是的,如果一个人使用

<script type="text/x-handlebars">
    {{#each App.ItemsController.arrangedContent }}
        <p>[ id: {{id}}, name: {{name}} ]</p>
    {{/each}}
</script>

然后我们得到我们想要的东西:

[ id: 2, name: apple ]

[ id: 4, name: banana ]

[ id: 6, name: spaghetti ]

Answer 1

我有同样的问题.花了一段时间,但最终这个通用的解决方案解决了它:

App.ArrayController = Ember.ArrayController.extend({
  sortProperties: ['id'],
  sortAscending: true,

  sortedContent: (function() {
    var content;
    content = this.get("content") || [];
    return Ember.ArrayProxy.createWithMixins(Ember.SortableMixin, {
      content: content.toArray(),
      sortProperties: this.get('sortProperties'),
      sortAscending: this.get('sortAscending')
    });
  }).property("content.@each", 'sortProperties', 'sortAscending'),

  doSort: function(sortBy) {
    var previousSortBy;
    previousSortBy = this.get('sortProperties.0');
    if (sortBy === previousSortBy) {
      return this.set('sortAscending', !this.get('sortAscending'));
    } else {
      set('sortAscending', true);
      return this.set('sortProperties', [sortBy]);
    }
  }
});

现在我的大多数ArrayControllers都扩展App.ArrayController而不是Ember.ArrayController,特别是那些以Ember/Data RecordArray为内容的扩展.

现在,在您的车把模板中,执行以下操作:

 {{#each item in sortedContent}}
   ...          
 {{/each}}

代替

 {{#each item in content}}
   ...          
 {{/each}}

Answer 2

从Ember 1.1.2和ember-data 1.0.0-beta.3开始,可能更早,只需在Controller上设置sortProperties即可.sortAscending可以设置为true或false取决于您要排序的方向.

App.ArrayController = Ember.ArrayController.extend({
  sortProperties: ['name'],
  sortAscending: true
})

但请注意

sortProperties: ['id']

似乎是词法排序而不是数字排序.我通过created_at时间戳来绕过词法排序,但可能还有另一种方法.