AngularJS | limitTo Filter
The limitTo filter in AngularJS is used to returns an array or a string which contains a specified number of elements. This filter can be used with arrays, strings, and numbers. The basic principle, however, remains the same in all the three cases.
- For arrays, it returns an array containing only the specified number of items.
- When used for strings, it returns another string containing the specified number of characters.
- In the case of numbers, it returns a string containing only the specified number of digits.
- Negative numbers are used to return elements starting from the end of the element, instead of the beginning.
Syntax:
{{ object | limitTo : limit : begin }}
Parameters:
- limit: Number of returned elements.
- begin: Begin point of limitation. default is 0.
Example-1:
<!DOCTYPE html> <html> <script src= </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> |
Output:
Let’s have a look at another example to make things more clear.
Example-2:
<!DOCTYPE html> <html> <script src= </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> |
Output:
In this example, we can see that the limit in the ‘firstName’ expression has been specified to 8. Therefore it doesn’t matter how long the first name of the user is, only the first 8 characters of the first name will be displayed.
Please Login to comment...