MVC 6 – Tag Helper

A lo largo de las siguientes entradas, si el tiempo me lo permite, trataré de presentar algunas de las nuevas cosas que se están desarrollando en MVC 6 y que más pronto que tarde tendremos a nuestra disposición. En esta ocasión una de las novedades que mas curiosidad destacó entre los diferentes MVP que asistimos al MVP Summit celebrado en Noviembre y que corresponde a los nuevos Tag Helpers.

Seguro que para todos los que alguna vez habéis trabajado con MVC estáis habituados a los diferentes y varioados HTML Helpers que MVC 5 y anteriores ponen a nuestra disposición para nuestras vistas tal y como vemos en el siguiente código:

 

Aunque este código no llega a ser como nuestro ya muy viejo amigo para algunos ASP Spaguetti si tiene muchas trazas de esto y también padece de algunos de sus males. La dificultad que tiene este código para ser maquetado o trabajado por herramientas o personas que entienden HTML y no helpers. Con la idea de resolver estos problemas, y con las siempre idea de simplificar y mejorar las experiencias de los diferentes perfiles que pueden entrar en el desarrollo de una aplicación web, la nueva versión de MVC, MVC 6 incluirá la característica de Tag Helpers, que no son mas que pequeños parsers de atributos o contenido que nos permitirán tener un código mucho mas limpio y claro.

 

Como lo mejor es siempre ver un poco de código fíjese en las siguientes líneas:

 

Aunque no entraremos en todos los atributos ni en todos los elementos soportados creo que con estas pocas líneas la idea se puede observar con claridad. Fíjese en el nuevo atributo for  usado en las etiquetas label o input iniciales. Observe como lo que indican no es mas que una expresión de acceso a nuestro modelo, en concreto a la propiedad Name, para el div inicial. Razor dispone ahora de una nueva directiva @addtaghelper, la cual permite descubrir el conjunto de clases que realizarán el parser de estos atributos y/o elementos para generar el mismo html que podríamos tener con nuestros HTML Helpers. En el caso de este ejemplo se usan los Tag Helpers por defecto como podemos ver en la definición de nuestro _ViewStart.cshtml

¿Cómo funcionan estos parsers? El ensamblado anterior, Microsoft.AspNet.Mvc.TagHelpers, dispone de diferentes parsers,  en concreto para los elementos Anchor,Form,Input,Label,Option,Select,TextArea,Div , es posible que para la versión final algún nuevo elemento este soportado. Cada parser es una clase que hereda de TagHelper y tiene como responsabilidad procesar el elemento de entrada así como el conjunto de atributos de los que dispone para junto la información del modelo generar un output tal y como dicta esta clase base.

Para entender mejor como funcionan, en vez de ver el código de alguno de los existentes, veremos un Tag helper custom que permite parsear un elemento de tipo p y observar su contenido para  reemplazar en estos elementos todos las uri por su correspondiente elemento a.

 

 

 

Por supuesto, al igual que hicimos antes, para que nuestras vistas usen este nuevo Tag Helper tendremos que indicárselo con la correspondiente directiva.

 

 

Bueno, espero que os guste esta entrada y esta novedad en MVC 6, espero poder seguir escribiendo un poco, que tenía el solar muy abandonado por otro tipo de contribuciones.

 

saludos

unai