AngularJS- limitTofilter
Voorbeeld
Geef alleen de eerste drie items van een array weer:
<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x
in cars | limitTo : 3">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl',
function($scope) {
$scope.cars = ["Audi", "BMW",
"Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
Definitie en gebruik
Het limitTofilter retourneert een array of een tekenreeks die slechts een opgegeven aantal elementen bevat.
Wanneer het limitTofilter voor arrays wordt gebruikt, retourneert het een array die alleen het opgegeven aantal items bevat.
Wanneer het limitTofilter voor tekenreeksen wordt gebruikt, retourneert het een tekenreeks die alleen het opgegeven aantal tekens bevat.
Wanneer het limitTofilter voor getallen wordt gebruikt, retourneert het een tekenreeks die alleen het opgegeven aantal cijfers bevat.
Gebruik negatieve getallen om elementen te retourneren vanaf het einde van het element, in plaats van vanaf het begin.
Syntaxis
{{ object | limitTo :
limit :
begin }}
Parameterwaarden
| Value | Description |
|---|---|
| limit | A number, specifying how many elements to return |
| begin | Optional. A number specifying where to begin the limitation. Default is 0 |
Meer voorbeelden
Voorbeeld
Geef de laatste drie items van de array weer:
<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x
in cars | limitTo : -3">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl',
function($scope) {
$scope.cars = ["Audi", "BMW",
"Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
Voorbeeld
Toon drie items, beginnend bij positie 1:
<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x
in cars | limitTo : 3 : 1">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl',
function($scope) {
$scope.cars = ["Audi", "BMW",
"Dodge", "Fiat", "Ford", "Volvo"];
});
</script>
Voorbeeld
Geef de eerste drie tekens van de tekenreeks weer:
<div ng-app="myApp" ng-controller="sizeCtrl">
<h1>{{txt | limitTo :
3}}</h1>
</div>
<script>
var app = angular.module('myApp',
[]);
app.controller('sizeCtrl', function($scope) {
$scope.txt = "Hello, welcome to AngularJS";
});
</script>
Voorbeeld
Geef de eerste drie cijfers van het nummer weer:
<div ng-app="myApp" ng-controller="sizeCtrl">
<h1>{{phone | limitTo :
3}}</h1>
</div>
<script>
var app = angular.module('myApp',
[]);
app.controller('sizeCtrl', function($scope) {
$scope.phone =
"123456789";
});
</script>
Gerelateerde pagina's
AngularJS-zelfstudie: Hoekfilters