Underscore.js es una biblioteca de JavaScript que proporciona muchas funciones útiles que ayudan en la programación en gran medida, como el mapa, el filtro, las invocaciones, etc., incluso sin usar ningún objeto integrado.
La función _.template() es una función incorporada en la biblioteca de JavaScript Underscore.js que se utiliza para compilar plantillas de JavaScript en funciones que se pueden evaluar para la representación. Útil para representar bits complicados de HTML a partir de fuentes de datos JSON.
Funciones de plantilla para crear una función de plantilla que se compila y puede interpolar propiedades de datos en delimitadores de interpolación, ejecutar JavaScript en delimitadores de evaluación y propiedades interpoladas de datos de escape HTML en delimitadores de escape. Además, las propiedades de los datos se recuperan en la plantilla como variables libres.
Sintaxis:
_.template(templateString, [settings])
Parámetros: este método acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:
- templateString: Es una string que se usaría como plantilla.
- settings: es un objeto que debe ser un hash que contenga cualquier _.templateSettings que deba anularse.
Valor de retorno: este método devuelve la función de plantilla compilada.
Ejemplo 1:
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
</script>
</head>
<body>
<script>
// Using the template() method with
// additional parameters
let compiled_temp = _.template(
"<% _.forEach(students, function(students) " +
"{ %><li><b><%- students %></b></li><% }); %>"
)({ students: ["Shubham", "Shakya"] });
// Displays the output
console.log(compiled_temp);
</script>
</body>
</html>
Producción:
Hi Shubham!
Ejemplo 2:
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
</script>
</head>
<body>
<script>
// Using the _.template() method to
// create a compiled template using
// the internal print function in
// the "evaluate" delimiter
var comptempl = _.template("<% print('hey ' + geek); %>...");
// Assigning value to the evaluate delimiter
let result =
comptempl({ 'geek': 'Shubham' });
// Displays output
console.log(result);
</script>
</body>
</html>
Producción:
hey Shubham...
Ejemplo 3:
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
</script>
</head>
<body>
<script>
// Using the template() method with
// additional parameters
let compiled_temp = _.template(
"<% _.forEach(students, function(students) " +
"{ %><li><b><%- students %></b></li><% }); %>"
)({ students: ["Shubham", "Shakya"] });
// Displays the output
console.log(compiled_temp);
</script>
</body>
</html>
Producción:
<li><b>Shubham</b></li><li><b>Shakya</b></li>
Referencia: https://underscorejs.org/#template
Publicación traducida automáticamente
Artículo escrito por SHUBHAMSINGH10 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA