I have a list of objects in a table-view i would like to sort properly.

Amongst other things, my objects contain a name-field. This name field can also contain numbers, so for example: Chairman Seat 1 Seat 2 Seat 3 Seat 11 Seat 12 Seat 23 Secretary

This is however sorted like this: Chairman Seat 1 Seat 11 Seat 12 Seat 2 Seat 23 Seat 3 Secretary

This doesn't seem like a natural way of sorting my list when sorting by name.

Now i'm using the ng-repeat like this: seat in seats | orderBy:orderField:orderReverse track by seat.id Where orderfield is some variable that is set when clicking the table header and orderReverse is too for reversing.

I've tried making a custom filter to makes sure it behaves properly but i failed. It seems that Javascript just won't order it normally unless i break up the string. But i'd rather not because the data is often updated by polling. Another way would be to force leading zero's but since users are entering this stuff manually i'm not sure if i should.

Also, its not only names with numbers in them, so i can't just pletely cut them off

So, any suggestions on how to make this list show normally?

Edit: cleared up some info about the problem.

I have a list of objects in a table-view i would like to sort properly.

Amongst other things, my objects contain a name-field. This name field can also contain numbers, so for example: Chairman Seat 1 Seat 2 Seat 3 Seat 11 Seat 12 Seat 23 Secretary

This is however sorted like this: Chairman Seat 1 Seat 11 Seat 12 Seat 2 Seat 23 Seat 3 Secretary

This doesn't seem like a natural way of sorting my list when sorting by name.

Now i'm using the ng-repeat like this: seat in seats | orderBy:orderField:orderReverse track by seat.id Where orderfield is some variable that is set when clicking the table header and orderReverse is too for reversing.

I've tried making a custom filter to makes sure it behaves properly but i failed. It seems that Javascript just won't order it normally unless i break up the string. But i'd rather not because the data is often updated by polling. Another way would be to force leading zero's but since users are entering this stuff manually i'm not sure if i should.

Also, its not only names with numbers in them, so i can't just pletely cut them off

So, any suggestions on how to make this list show normally?

Edit: cleared up some info about the problem.

• javascript
• string
• angularjs
• sorting
• numbers

• You should write your own sorting function. – dfsq Commented Sep 10, 2014 at 13:35
• Search for "natural sort". – Blackhole Commented Sep 10, 2014 at 13:42
• @dfsq i could do that but how would i know the difference between with number and without. And how would i give them the proper order? – Martinspire Commented Sep 10, 2014 at 14:23
• @blackhole, i've tried that before submitting but that doesn't really seem to work if you want to sort by multiple columns correctly. I'll investigate further and post a jsfiddle if i can't work it out. – Martinspire Commented Sep 10, 2014 at 14:24
• And why did my question get -1? It had enough info to create an answer didn't it? – Martinspire Commented Sep 10, 2014 at 21:44

1 Answer 1

You can use a custom sort function with orderBy (it can take custom sorting function too)

define a sort function in your controller:

$scope.sorter = function (a){
   return parseInt(a.replace( /^\D+/g, '')); // gets number from a string
}

and then in your template

seat in seats | orderBy:sorter track by seat.id

Edit as per the modified problem statement:

Do manual sorting in controller instead of with ng-repeart using naturalSort

$scope.seats = [{"id": "Seat 12"},{"id": "Seat 3"},{"id": "Seat 1"},{"id": "Seat 2"},{"id": "Secretary"}];
$scope.seats.sort(function(a,b) {
    return naturalSort(a.id, b.id);
})

or check this angular module http://blog.overzealous./post/55829457993/natural-sorting-within-angular-js and the fiddle demonstrating it - http://jsfiddle/wE7H2/3/