如何在不使用数组控制器的情况下在 Ember 模型中实现排序？

Question

每个 google 结果都是关于 ArrayController 排序的。需要一个不使用 ArrayController 的排序机制。

有一个模型，其中有排序参数。就像说 'sortOrder' 作为模型中的属性之一（这将来自后端）。

将使用#each 渲染此模型，但这应该根据排序顺序属性而不是模型的 ID 属性.

进行迭代

Answer 1

您只需要在控制器或组件中包含一个 SortableMixin，然后指定 sortAscending 和 sortProperties 属性。

Em.Controller.extend(Em.SortableMixin, {
  sortAscending: true,
  sortProperties: ['val']
});

Here is a working demo.

Answer 2

在这种情况下，我直接使用 Ember.ArrayProxy 和 Ember.SortableMixin。

An ArrayProxy wraps any other object that implements Ember.Array and/or Ember.MutableArray, forwarding all requests. This makes it very useful for a number of binding use cases or other cases where being able to swap out the underlying array is useful.

例如，我可能有一个控制器属性这样的：

sortedItems: function(){
        var items = Ember.ArrayProxy.extend(Ember.SortableMixin).create({content: this.get('someCollection')});
        items.set('sortProperties', ['propNameToSortOn']);
        return items;
}.property()

像这样：JSBin

Answer 3

这是我手动排序的方式（使用 ember 比较）

import Ember from "ember";
import { attr, Model } from "ember-cli-simple-store/model";

var compare = Ember.compare, get = Ember.get;

var Foo = Model.extend({
    orderedThings: function() {
        var things = this.get("things");
        return things.toArray().sort(function(a, b) {
            return compare(get(a, "something"), get(b, "something"));
        });
    }.property("things.@each.something")
});

Answer 4

在 Ember 2.0 中 SortableMixin 已被弃用，也即将被淘汰。

在 Controller（不是 ArrayController）中，您可以定义一个新的计算属性，例如下面的 SortedUsers1,2,3：

export default Ember.Controller.extend({
    sortProps: ['lastName'],
    sortedUsers1: Ember.computed.sort('model', 'sortProps'),
    sortedUsers2: Ember.computed.sort('content', 'sortProps'),
    sortedUsers3: Ember.computed('content', function(){
        return this.get('content').sortBy('lastName');
    })
});

上面的假设是模型本身是一个用户数组，其中 lastName 作为用户属性之一。对 'model' 和 'content' 的依赖在我看来是等价的。上面的所有三个计算属性都生成相同的排序列表。

请注意，您不能在 sortedUsers1,2 中将 'sortProps' 参数替换为 'lastName' - 它不会起作用。

要更改排序顺序，请将 sortProps 修改为

sortProps: ['lastName:desc']

此外，如果您的模板在 users/index 文件夹中，那么您的控制器也必须在那里。 users/里面的controller不会做，即使路由加载模型在users/.

在模板中的用法符合预期：

    <ul>
        {{#each sortedUsers1 as |user|}}
            <li>{{user.lastName}}</li>
        {{/each}}
    </ul>

如何在不使用数组控制器的情况下在 Ember 模型中实现排序？

How is Sorting achieved in an Ember model without using Array Controller?

ember.js

ember-data

ember-cli