¿Cómo truncar texto en Angular2?

Enfoque: es fácil truncar texto en Angular. El texto truncado nos ayuda a eliminar o cortar porciones de texto. Termina abruptamente el texto, reduciendo la longitud del texto. Elimina texto de acuerdo con la función de truncado utilizada.

Sintaxis:

  • La longitud de la string es mayor que los caracteres proporcionados.
    function(str, length, ending) {........}
  • La string se trunca a una determinada longitud de palabras especificada.
    function truncate(str, no_words) {
        return str.split(" ").splice(0, no_words).join(" ");
    }

Ejemplo 1: este ejemplo muestra la forma en que se trunca el texto en Angular. Aquí, la longitud del texto/string es más larga que los caracteres dados. Se crea la función truncar, que verifica la condición si la longitud de la string es mayor que la longitud dada. Luego devuelve el texto truncado en consecuencia.

<!DOCTYPE html> 
<html> 
<head> 
    <title>Truncate text in Angular2</title> 
  
    <script src = 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
  
    <script src = 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"> 
    </script> 
</head> 
      
<body style = "text-align:center;"> 
          
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1> 
          
    <script> 
text_truncate = function(str, length, ending) {
       
    if (ending == null) {
      ending = '...';
    }
       
    if (str.length > length) {
      return str.substring(0, length - ending.length) + ending;
    } else {
      return str;
    }
  };
   
console.log(text_truncate('Truncate text using Geeks for Geeks',11))
console.log(text_truncate('Truncate text using Geeks for Geeks',11,'!!'))
    </script> 
</body> 
</html>                    

Producción:

Ejemplo 2: Este ejemplo muestra cómo truncar el texto en ciertas palabras. Elimina las palabras que no están incluidas en el límite dado. Para este propósito: se utilizan str.split, splice y join.

<!DOCTYPE html> 
<html> 
<head> 
    <title>Angular JS Route Change</title> 
  
    <script src = 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
  
    <script src = 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"> 
    </script> 
</head> 
      
<body style = "text-align:center;"> 
          
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1> 
          
    <script> 
function truncate(str, no_words) {
    return str.split(" ").splice(0, no_words).join(" ");
}
  
console.log(truncate('Geeks for Geeks Portal: Truncate Text Using GFG', 6));
    </script> 
</body> 
</html>                    

Producción:

Publicación traducida automáticamente

Artículo escrito por riarawal99 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 *