Sugerencia rápida Introducción a las plantillas de jQuery

JavaScript Templating es una buena idea: te permite convertir fácilmente JSON a HTML sin tener que analizarlo. En la conferencia MIX10 de Microsoft, anunciaron que están empezando a contribuir al equipo de jQuery. Uno de sus esfuerzos es proporcionar un complemento de plantillas. En este consejo rápido, te mostraré cómo usarlo.!

Suscríbete a nuestra página de YouTube para ver todos los videos tutoriales.!

Necesitará los datos para la plantilla; es probable que recupere JSON de su servidor; Por supuesto, los literales de objetos / matrices funcionan igual de bien, así que eso es lo que usamos:

 var data = [nombre: "John", edad: 25, nombre: "Jane", edad: 49, nombre: "Jim", edad: 31, nombre: "Julie", edad: 39 , nombre: "Joe", edad: 19, nombre: "Jack", edad: 48];

La plantilla esta escrita en etiquetas para cada elemento en su JSON, la plantilla representará el HTML; entonces, te devolverá el fragmento HTML completo. Podemos obtener los valores de JavaScript desde la plantilla utilizando % y% como etiquetas. También podemos ejecutar JavaScript regular dentro de estas etiquetas. Aquí está nuestra plantilla:

 
 % = $ i + 1% 
Nombre:  % = nombre%
 % if ($ context.options.showAge) % 
Años:  % = edad%
 %% 

Para representar los datos con la plantilla, llame al complemento; pasar los datos al método del complemento; Opcionalmente, también puede pasar un objeto de opciones. (Estas no son opciones predefinidas; son valores que desea usar dentro de la plantilla, tal vez para bifurcar).

 $ ("# listTemplate"). render (data, showAge: true). appendTo ("ul");

¡Es fácil! ¡Diviértete con eso! Puede obtener el código completo para este consejo rápido en Github