javascript AngularJS 中的动态 orderBy

Dynamic orderBy in AngularJS

提问by Wouter

I have an array of objects I want to order dynamically, based on a value from a drop down menu. This is what I have so far in my list:

我有一个我想根据下拉菜单中的值动态排序的对象数组。这是我迄今为止在我的列表中的内容：

ng-repeat="item in filteredItems = (items | filter:searchInput | orderBy:canBeAnything)"

But the problem however is that the sorting can be an attribute of the object or a calculated value using a function. It also should be able to sort in a descending way (optionally).

但问题是排序可以是对象的属性或使用函数计算的值。它还应该能够以降序方式排序（可选）。

I know I can use a string for the canByAnything variable behind the orderBy passing an attribute of the object like:

我知道我可以在 orderBy 后面的 canByAnything 变量中使用字符串，传递对象的属性，例如：

“-creationDate” // descending ordering on creation date
“customer.lastname” // ascending ordering on customers last name

I also know I can orderBy a function like:

我也知道我可以 orderBy 像这样的函数：

orderBy:myCalculatedValueFunction // will order in an ascending way based on a calculated value, for example calculating the total price of the object if it was an order or something

But what I don't know and want to achieve is:

但我不知道和想要实现的是：

• How to combine it so I can use function(s) for sorting in combination with attributes/properties of the objects. I mean one or the other, dynamically, based on what the user has selected. Which can be an attribute or a calculated value, either descending or ascending.
• How to sort a calculated value in a descending way

• 如何组合它，以便我可以使用函数与对象的属性/属性组合进行排序。我的意思是根据用户的选择动态地选择一个。可以是属性或计算值，降序或升序。
• 如何以降序方式对计算值进行排序

回答by csbarnes

Update orderBy:myCalculatedValueFunctionto something like orderBy:dynamicOrderFunction:

更新orderBy:myCalculatedValueFunction到类似的东西orderBy:dynamicOrderFunction：

ERRONEOUS

$scope.dynamicOrderFunction = function() {
    if (orderByString) {
        return '-creationDate';
    }
    else {
        return myCalculatedValueFunction;
    }
}

错误

$scope.dynamicOrderFunction = function() {
    if (orderByString) {
        return '-creationDate';
    }
    else {
        return myCalculatedValueFunction;
    }
}

orderByalso has a 3rd property that accepts a boolean and will reverse orderBy when true. (orderBy:dynamicOrderFunction:reverseOrderwhere $scope.reverseOrder = true; // or false)

orderBy还有一个第三个属性，它接受一个布尔值，并且当 时将反转 orderBy true。(orderBy:dynamicOrderFunction:reverseOrder哪里$scope.reverseOrder = true; // or false)

---

---

edit

编辑

You will actually run into issues trying to switch orderBy between a string a function this way. Checkout out this jsfiddlefor a working dynamic order function.

尝试以这种方式在字符串和函数之间切换 orderBy 时，您实际上会遇到问题。查看此 jsfiddle以获得有效的动态订单功能。

$scope.dynamicOrder = function(user) {
    var order = 0;
    switch ($scope.order.field) {
        case 'gender':
            order = gender_order[user.gender];
            break;
        default:
            order = user[$scope.order.field];
    }
    return order;
}

回答by adam

So you have to create your own filter and do what ever you want in it, there's tons of example on google. Just search :

所以你必须创建你自己的过滤器并做任何你想做的事情，谷歌上有很多例子。只需搜索：

angular custom filter

角度自定义过滤器

Theses last days, i experience somes issues with filters creation and i found that: https://github.com/a8m/angular-filter

最后几天，我在创建过滤器时遇到了一些问题，我发现：https: //github.com/a8m/angular-filter

I've added it immediately in my dependcies, i know i will use it really soon. May be it will help you too. Don't forget to valid my answer if it helps you to resolve your problem ;)

我已立即将它添加到我的依赖项中，我知道我很快就会使用它。也许它也会帮助你。如果可以帮助您解决问题，请不要忘记验证我的答案；)