AngularJS orderby целое поле не работает должным образом

Я просто взял простейшую демонстрацию из http://docs.angularjs.org/api/ng.filter:orderBy и просто изменил значение возраста, чтобы иметь разное количество цифр. Он перестает работать, как ожидалось. Его порядок как "строка" не как "целое" значение. Как мне изменить его так, чтобы он упорядочивался по возрасту, как целое значение?

Демонстрация Plunkr здесь http://plnkr.co/edit/pzgiIYrki7jUZdVaTMt9?p=preview

Коды:

function Ctrl($scope) {
  $scope.friends =
      [{name:'John', phone:'555-1212', age:'2352345'},
       {name:'Mary', phone:'555-9876', age:'4235243'},
       {name:'Mike', phone:'555-4321', age:'241'},
       {name:'Adam', phone:'555-5678', age:'34325'},
       {name:'Julie', phone:'555-8765', age:'1234'}]
  $scope.predicate = '-age';
}


<!doctype html>
<html ng-app="App">
  <head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
  <body>

<div ng-controller="Ctrl">
  <pre>Sorting predicate = {{predicate}}; reverse = {{reverse}}</pre>
  <hr/>
  [ <a href="" ng-click="predicate=''">unsorted</a> ]
  <table class="friend">
    <tr>
      <th><a href="" ng-click="predicate = 'name'; reverse=false">Name</a>
          (<a href="" ng-click="predicate = '-name'; reverse=false">^</a>)</th>
      <th><a href="" ng-click="predicate = 'phone'; reverse=!reverse">Phone Number</a></th>
      <th><a href="" ng-click="predicate = 'age'; reverse=!reverse">Age</a></th>
    </tr>
    <tr ng-repeat="friend in friends | orderBy:predicate:reverse">
      <td>{{friend.name}}</td>
      <td>{{friend.phone}}</td>
      <td>{{friend.age}}</td>
    </tr>
  </table>
</div>


  </body>
</html>

Ответы

Ответ 1

вам нужно преобразовать возраст, чтобы ввести Number, чтобы сделать orderBy работать так, как должно быть.

Добавьте к контроллеру сортировку String age как float:

   angular.forEach($scope.friends, function (friend) {
    friend.age = parseFloat(friend.age);
   });

Он должен работать,

См. PLunker

Ответ 2

Я знаю, немного опоздал на этот ответ, но в новейшей версии Angular вы можете использовать функцию в качестве предиката orderBy (https://docs.angularjs.org/api/ng/filter/orderBy). В этом случае добавьте в контроллер функцию, подобную следующей

$scope.orderByFunction = function(friend){
    return parseInt(friend.age);
};

и измените предикат в файле orderBy

ng-repeat="friend in friends | orderBy:orderByFunction:reverse"

Это сделает трюк!

Ответ 3

Вам просто нужно удалить кавычки в переменной возраста, потому что это целое число, а не строка:

  $scope.friends =
      [{name:'John', phone:'555-1212', age:2352345},
       {name:'Mary', phone:'555-9876', age:4235243},
       {name:'Mike', phone:'555-4321', age:241},
       {name:'Adam', phone:'555-5678', age:34325},
       {name:'Julie', phone:'555-8765', age:1234}]

Ответ 5

Будет также изменено изменение вашего предиката на следующее:

<th><a href="" ng-click="predicate = '1*age'; reverse=!reverse">Age</a></th>

Ответ 6

Добавить код JSON_NUMERIC_CHECK при преобразовании массива в json. json_encode ($ anyarray, JSON_NUMERIC_CHECK);