AngularJS | limitTo Filter

El filtro limitTo en AngularJS se usa para devolver una array o una string que contiene un número específico de elementos . Este filtro se puede utilizar con arrays, strings y números. Sin embargo, el principio básico sigue siendo el mismo en los tres casos.

  • Para arrays, devuelve una array que contiene solo el número especificado de elementos.
  • Cuando se usa para strings, devuelve otra string que contiene el número de caracteres especificado.
  • En el caso de los números, devuelve una string que contiene solo el número de dígitos especificado.
  • Los números negativos se utilizan para devolver elementos que comienzan desde el final del elemento, en lugar del principio.

Sintaxis:

{{ object | limitTo : limit : begin }}

Parámetros:

  • límite: Número de elementos devueltos.
  • comenzar: punto de inicio de la limitación. el valor predeterminado es 0.

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

Producción:

Echemos un vistazo a otro ejemplo para aclarar las cosas.
Ejemplo-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>

Producción:

En este ejemplo, podemos ver que el límite en la expresión ‘firstName’ se ha especificado en 8. Por lo tanto, no importa qué tan largo sea el nombre del usuario, solo se mostrarán los primeros 8 caracteres del nombre. .

Publicación traducida automáticamente

Artículo escrito por sanchit496 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *