Question

74

Dynamic orderBy in AngularJS

rated 0 times [ 76] [ 2] / answers: 1 / hits: 16938 / 9 Years ago, tue, april 14, 2015, 12:00:00

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:

“-creationDate” // descending ordering on creation date

“customer.lastname” // ascending ordering on customers last name

I also know I can orderBy a function like:

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

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

brianaclaras

Add To Favorites

Follow

Total Points: 23

Total Questions: 106

Total Answers: 111

Location: Japan

Member since Sat, Jun 6, 2020

4 Years ago

brianaclaras questions

1 Type ref is not assignable to type IntrinsicAttributes

Fri, Oct 15, 21, 00:00, 3 Years ago

1 Why is `Promise.then` called twice in a React component but not the console.log?

Wed, Jul 7, 21, 00:00, 3 Years ago

1 when to use Nextjs over the React itself?

Thu, Dec 3, 20, 00:00, 4 Years ago

1 Typeorm find with and & or where block

Mon, May 25, 20, 00:00, 4 Years ago

1 Adding File to Azure Storage Blob from Angular

Wed, Mar 4, 20, 00:00, 4 Years ago

View All

answered 9 Years ago claudia · Accepted Answer

Update orderBy:myCalculatedValueFunction to something like orderBy:dynamicOrderFunction:

ERRONEOUS

$scope.dynamicOrderFunction = function() {

    if (orderByString) {

        return '-creationDate';

    }

    else {

        return myCalculatedValueFunction;

    }

}

orderBy also has a 3rd property that accepts a boolean and will reverse orderBy when true. (orderBy:dynamicOrderFunction:reverseOrder where $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 jsfiddle for a working dynamic order function.

$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;

}