AngularJS limitTo
过滤器
定义和用法
limitTo
过滤器返回仅包含指定数量元素的数组或字符串。
当 limitTo
过滤器用于数组时,它返回一个只包含指定数量项的数组。
当 limitTo
过滤器用于字符串时,它返回一个仅包含指定数量字符的字符串。
当 limitTo
过滤器用于数字时,它返回一个只包含指定位数的字符串。
使用负数返回从元素末尾开始的元素,而不是从元素开头开始的元素。
语法
{{ object | limitTo :
limit :
begin }}
参数值
值 | 描述 |
---|---|
limit | 数字,指定要返回的元素数 |
begin | 可选。指定从何处开始限制的数字。默认值为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 Filters