AngularJS begrænsetTil filter

Definition og brug

begrænsetTil Filteret returnerer en liste eller streng, der kun indeholder de angivne antal elementer.

Når begrænsetTil Filteret returnerer en liste, der kun indeholder de angivne antal elementer, når det bruges med lister.

Når begrænsetTil Filteret returnerer en streng, der kun indeholder de angivne antal tegn, når det bruges med strenge.

Når begrænsetTil Filteret returnerer en streng, der kun indeholder de angivne antal cifre, når det bruges med tal.

Brug af negative tal returnerer elementer fra slutningen af strengen i stedet for fra begyndelsen.

Relaterede sider

AngularJS Tutorial:Angular filter

Eksempel

Eksempel 1

Vis kun de første tre elementer i listen:

<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x i biler | begrænsetTil : 3">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.biler = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>

Prøv det selv

Eksempel 2

Vis de sidste tre elementer i listen:

<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x i biler | begrænsetTil : -3">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.biler = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>

Prøv det selv

Eksempel 3

Vis tre elementer fra position 1:

<div ng-app="myApp" ng-controller="sizeCtrl">
<ul>
<li ng-repeat="x i biler | begrænsetTil : 3 : 1">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.biler = ["Audi", "BMW", "Dodge", "Fiat", "Ford", "Volvo"];
});
</script>

Prøv det selv

Eksempel 4

Vis de første tre bogstaver af en streng:

<div ng-app="myApp" ng-controller="sizeCtrl">
<h1>{{txt | begrænsetTil : 3}}</h1>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('sizeCtrl', function($scope) {
    $scope.txt = "Hej, velkommen til AngularJS";
});
</script>

Prøv det selv

Eksempel 5

Vis de første tre cifre af tallet:

<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>

Prøv det selv

Syntaks

{{ object | limitTo : limit : begin }}

Parameter