AngularJS | limitTo过滤用法指南 _limitTo

限制于AngularJS中的过滤器用于退货包含指定数量的元素的数组或字符串。该过滤器可以与数组, 字符串和数字一起使用。但是, 这三种情况的基本原理都相同。

对于数组, 它返回仅包含指定数量的项目的数组。
当用于字符串时, 它返回另一个包含指定数量字符的字符串。
对于数字, 它将返回仅包含指定数字位数的字符串。
负数用于从元素末尾而不是开头返回元素。

语法如下：

{{ object | limitTo : limit : begin }}

参数：

限制：返回的元素数。
开始：限制的起点。默认值为0。

示例1：

< !DOCTYPE html> < html > < script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" > < / script > < body > < h2 > AngularJS - limitTO< / h2 > < br > < br > < div ng-app = "myApp" ng-controller = "myCtrl" > < strong > Input:< / strong > < br > < input type = "text" ng-model = "string" > < br > < br > < strong > Output:< / strong > < br > {{string|limitTo:4}}< / div > < script > var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.string = ""; }); < / script > < / body > < / html >

输出如下：

文章图片
让我们来看另一个示例, 以使事情更加清楚。
示例2：

< !DOCTYPE html> < html > < script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" > < / script > < body > < h2 > AngularJS - limitTO< / h2 > < br > < br > < div ng-app = "myApp" ng-controller = "myCtrl" > < strong > Input:< / strong > < br > < input type = "text" ng-model = "firstName" > < br > < br > < strong > Output:< / strong > < br > {{firstName|limitTo:8}}< / div > < script > var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.firstName = ""; }); < / script > < / body > < / html >

输出如下：