limitTo
Фильтр AngularJS
Пример
Отображать только первые три элемента массива:
<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>
Определение и использование
Фильтр limitTo
возвращает массив или строку, содержащую только указанное количество элементов.
Когда limitTo
фильтр используется для массивов, он возвращает массив, содержащий только указанное количество элементов.
Когда limitTo
фильтр используется для строк, он возвращает строку, содержащую только указанное количество символов.
Когда limitTo
фильтр используется для чисел, он возвращает строку, содержащую только указанное количество цифр.
Используйте отрицательные числа, чтобы возвращать элементы, начиная с конца элемента, а не с начала.
Синтаксис
{{ object | limitTo :
limit :
begin }}
Значения параметров
Value | Description |
---|---|
limit | A number, specifying how many elements to return |
begin | Optional. A number specifying where to begin the limitation. Default is 0 |
Дополнительные примеры
Пример
Отобразите последние три элемента массива:
<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>
Пример
Отобразите три элемента, начиная с позиции 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>
Пример
Отобразить первые три символа строки:
<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>
Пример
Вывести первые три цифры числа:
<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>
Связанные страницы
Учебник по AngularJS: фильтры Angular