<!DOCTYPE html>
<html>
<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"/>
</head>
<body>
<div ng-app="" ng-init="atp=[
{ name: 'Nadal, Rafael (ESP)', rank: 1 },
{ name: 'Djokovic, Novak (SRB)', rank: 2 },
{ name: 'Federer, Roger (SUI)', rank: 3 },
{ name: 'Wawrinka, Stan (SUI)', rank: 4 },
{ name: 'Ferrer, David (ESP)', rank: 5 },
{ name: 'Raonic, Milos (CAN)', rank: 6 },
{ name: 'Berdych, Tomas (CZE)', rank: 7 },
{ name: 'Nishikori, Kei (JPN)', rank: 8 },
{ name: 'Cilic, Marin (CRO)', rank: 9 },
{ name: 'Dimitrov, Grigor (BUL)', rank: 10 }
]; limitRange=10;">
<div class="panel-body">
Show the first
<select ng-model="limitRange">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
players:
</div>
<div id="atpPanel" class="panel">
<h3 class="panel-header">ATP SINGLES RANKINGS</h3>
<table class="table">
<thead>
<tr>
<th>Rank</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in atp | limitTo:limitRange">
<td>{{item.rank}}</td>
<td>{{item.name}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
The limitTo filter will also operate on string values, treating each character as an object in an array.
You don’t have to worry about going out of bounds. The limitTo filter will return all of the objects in the array if you specify a number that is greater than the size of the array.
Niciun comentariu:
Trimiteți un comentariu