AngularJS: custom orderBy

Question

I have an autocomplete search box.

<div ng-repeat="item in items| filter:search">

I would like to make it slightly better by sorting the results based on the the name of the items.

item1 {name:'applePy'}
item2 {name:'pineApple'}
item3 {name:'application'}
item4 {name:'anApple'}
item5 {name:'apple'}

With the current implementation when I write appl in the search box the result will be shown as follow:

anApple
apple
applePy
application
pineApple

But I would like the result to be ordered according to the inserted appl like:

apple
applePy
application
anApple
pineApple

The difference between the two ordering is that in this example the result is ordered according to the search string appl and the the rest of the result alphabetically.

How can I do this?

I don't understand the difference between the two orderings. — Anony372
– Anony372, Commented Jun 1, 2017 at 20:44

Uday · Accepted Answer · 2017-06-01 20:56:25Z

1

Are you looking for search to display the results of the items start with search character in ASC order? If so, you can do this by adding a new method:

$scope.startsWith = function (source, target) {
    return source.toLowerCase().indexOf(target.toLowerCase()) === 0;
}

Then change your DIV as:

<div ng-repeat="item in items| filter:search:startsWith">

If your intention is to list all the search results of "startsWith" and append the rest at the bottom in ASC order. You have to write a custom filter. See docs.

edited Jun 1, 2017 at 20:56

answered Jun 1, 2017 at 20:23

Uday

1,22511 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS: custom orderBy

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related