- first filter will sort by prize money all players that are outside the top 10 ATP
-second filter will sort by prize money all players from top 10 ATP
NOTE: The 999999999999 value is used for keeping the players outside top 10 at the end of the list (listed after the players in top 10). This value can be any number bigger that the bigest prize. If is not, like 0, then the players outside top 10 will be listed first (unsorted), and afterwards, the players in top 10 (sorted).
<!DOCTYPE html>
<html ng-app="atpModule">
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="../angular/angular.min.js"></script>
<link href="../bootstrap/css/bootstrap.css" rel="stylesheet"/>
<link href="../bootstrap/css/bootstrap-theme.css" rel="stylesheet"/>
<script>
angular.module("atpModule", [])
.controller("atpCtrl", function ($scope) {
$scope.rankOutsideTop10Sorter = function (item) {
return item.rank > 10 ? item.prizemoney : 0;
}
$scope.rankInsideTop10Sorter = function (item) {
return item.rank <= 10 ? item.prizemoney : 999999999999;
}
});
</script>
</head>
<body>
<div ng-controller="atpCtrl" ng-init="atp=[
{ name: 'Nadal, Rafael (ESP)', rank: 1, age: '28', prizemoney: 66149345 },
{ name: 'Djokovic, Novak (SRB)', rank: 2, age: '27', prizemoney: 70704129 },
{ name: 'Federer, Roger (SUI)', rank: 3, age: '33', prizemoney: 84827704 },
{ name: 'Wawrinka, Stan (SUI)', rank: 4, age: '29', prizemoney: 13155060 },
{ name: 'Ferrer, David (ESP)', rank: 5, age: '32', prizemoney: 24034072 },
{ name: 'Tsonga, Jo-Wilfried (FRA)', rank: 11, age: '29', prizemoney: 1708240 },
{ name: 'Simon, Gilles (FRA)', rank: 26, age: '29', prizemoney: 760469 },
{ name: 'Lopez, Feliciano (ESP)', rank: 20, age: '33', prizemoney: 1100579 },
{ name: 'Benneteau, Julien (FRA)', rank: 28, age: '32', prizemoney: 617688 },
{ name: 'Verdasco, Fernando (ESP)', rank: 33, age: '30', prizemoney: 689219 },
{ name: 'Mayer, Leonardo (ARG)', rank: 25, age: '27', prizemoney: 946294 }]">
<div id="atpPanel" class="panel">
<h3 class="panel-header">ATP SINGLES RANKINGS</h3>
<span class="label label-primary">Sort players outside top 10 by prize money</span>
<table class="table">
<thead>
<tr>
<th>Rank</th>
<th>Name</th>
<th>Age</th>
<th>Prize Money</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in atp | orderBy:rankOutsideTop10Sorter">
<td>{{item.rank}}</td>
<td>{{item.name}}</td>
<td>{{item.age}}</td>
<td>{{item.prizemoney | currency:"$"}}</td>
</tr>
</tbody>
</table>
<span class="label label-primary">Sort players in top 10 by prize money</span>
<table class="table">
<thead>
<tr>
<th>Rank</th>
<th>Name</th>
<th>Age</th>
<th>Prize Money</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in atp | orderBy:rankInsideTop10Sorter">
<td>{{item.rank}}</td>
<td>{{item.name}}</td>
<td>{{item.age}}</td>
<td>{{item.prizemoney | currency:"$"}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
First filter output:
Second filter output:
Niciun comentariu:
Trimiteți un comentariu