Tag Helper para Ancla >a<

El "Tag Helper" para <a> puede asistir cuando se requiere enlazar varias acciones en los Controladores. Es to se puede hacer manualmente con elementos ancla regulares de HTML y el atributo href, pero cuando se usa el "Tag Helper" para Anclas, el atributo href sera generado automáticamente.

El Controlador y los atributos de acciones

Los atributos más comúnmente usados de este "Tag Helper" son el controller y action. Como lo indican los nombres, te permiten referenciar a que Controlador quieres que se enlace la acción. Digamos que tenemos un controlador llamado MovieController con un método action llamado List(), para desplegar una lista de películas. Generar un enlace con el "Tag Helper" para el Anchor será como sigue:

<a asp-controller="Movie" asp-action="List">Movie list</a>

El HTML resultante se verá como sigue:

<a href="/Movie/List">Movie list</a>

Aquí se han usado ambos atributos (controller y action) - de lo contrario, ASP.NET hará suposiciones sobre que controller o action se quiere usar, basado en el controller/action de llamada. En la mayoría de las situaciones, es mejor especificar ambos atributos.

Atributo route-{valor}

En el ejemplo anterior, enlazamos una lista de películas, pero el "Tag Helper" para Anchor es incluso más útil cuando quieres enlazar un objeto específico - en el ejemplo, una película específica. Así, cuando la acción Lista es llamada, se retornará una lista de películas, como en éste ejemplo:

public IActionResult List()
{
	List<Movie> movies = new List<Movie>()
	{
		new Movie() { Id = 1, Title = "The Godfather" },
		new Movie() { Id = 2, Title = "Forrest Gump" },
		new Movie() { Id = 3, Title = "Fight Club" },
	};
	return View(movies);
}

En la Vista de la lista, se debería generar un enlace de salida al detalle para cada una de las películas:

<ul>
    @foreach(var movie in Model)
    {
        <li>
            <a asp-controller="Movie" asp-action="Details" asp-route-id="@movie.Id">@movie.Title</a>
        </li>
    }
</ul>

Se debe poner especial atención al último atributo, llamado asp-route-id. Este es un atributo comodín, con la última parte (id) haciendo referencia al nombre del parámetro de la acción. Si el parámetro tiene un nombre diferente a "id", p.ej. movieID, el atributo debería ser llamado asp-route-movieID en su lugar.

Más atributos

Los atributos anteriores son los más usados, pero existen varios otros disponibles que pueden resultar útiles. Aquí rápido vistazo:

El atributo "fragment"

Si necesitas hacer referencia a una parte específica de la página, se debe usar el atributo asp-fragment, de la siguiente forma:

<a asp-controller="Movie" asp-action="List" asp-fragment="test">Movie list</a>

El resultado se verá como sigue:

<a href="/Movie/List#test">Movie list</a>

El atributo "host"

Si necesitas especificar un nombre de anfitrión en un enlace, p.ej. google.com. Usualmente no necesario porque éste valor puede ser recogido desde el sitio web automáticamente si se necesita. Ejemplo:

<a asp-controller="Movie" asp-action="List" asp-host="google.com">Movie list</a>

Resultado:

<a href="http://google.com/Movie/List">Movie list</a>

El atributo "protocol"

El atributo "protocol" (p.ej. http o https) solo es necesario si quieres imponer un protocolo distinto al que se esta usando para generar las solicitudes. Ejemplo:

<a asp-controller="Movie" asp-action="List" asp-host="google.com" asp-protocol="https">Movie list</a>

Resultado:

<a href="https://google.com/Movie/List">Movie list</a>

Sumario

En éste artículo discutimos el "Tag Helper" para Anchor tal como los atributos mas importantes que se pueden usar con el. Hay unos cuantos más disponibles, para uso avanzado, como el atributo asp-area, etc. Cabe recordar que se pueden combinar los atributos de "Tag Helper" con los atributos de Anchor regulares de HTML, tal y como se haría con cualquier otro "Tag Helper".