ASP.NET MVC 6 Tag Helpers

Tag Helpers mają na celu ułatwić tworzenie widoków. Cel jest taki, aby widok jak najbardziej przypominał czysty plik HTML. Pierwszym etapem było wprowadzenie Razor, a teraz w MVC 6 mamy tzw. Tag Helper. W celu przetestowania tego samemu, należy zainstalować najpierw Visual Studio 2015.

Zacznijmy od przykładu. Klasyczny sposób na definiowanie linku to:

@Html.ActionLink("Jakis tekst", "About","Home",null,new { @class="styles1"})

Jeśli preferujemy składnię bardziej zbliżoną do HTML można byłoby także:

<a href="@Url.Action("About","Home")" cl class="styles1">Jakis tekst</a>

Oba rozwiązania nie są jednak idealne. Pierwsze kompletnie nie przypomina HTML, a drugie jest dość toporne. Używanie Url.Action jako parametr href jest mało wygodne.

Dzięki AnchorTagHelper możemy teraz:

<a asp-controller="Home" asp-action="About" class="styles1">Jakis tekst</a>

Oprócz tego, istnieje wiele innych helper’ow, np. InputTagHelper:

<input asp-for="StartDate" asp-format="{0:yyyy-MM-dd}" />

InputTagHelper ma dwa atrybuty, asp-for oraz asp-format. Pierwszy służy do określenia pola w modelu, a drugi formatu, w którym powinna wyświetlić się wartość. Klasyczny sposób wyglądałby następująco:

@Html.TextBoxFor(model => model.StartDate)

Do dyspozycji mamy również LabelTagHelper:

<label asp-for="FirstName" />

Nie chcę pokazywać przykładów dla każdego helpera bo wyglądają one analogicznie do siebie. Dla zainteresowanych wspomnę tylko, że mamy jeszcze SelectTagHelper, TextAreaTagHelper, ValidationMessageTagHelper, ValidationSummaryTagHelper oraz FormTagHelper.

Na zakończenie formularz:

<form asp-action="Submit" asp-controller="Home" asp-anti-forgery="true" method="post"> <div> <label asp-for="FirstName" /> <input asp-for="FirstName" type="text" /> <span class="validation" asp-validation-for="FirstName" /> </div> <strong>Validation Errors</strong> <div class="validation" asp-validation-summary="ModelOnly" /> </form>

Moim zdaniem ładniej to wygląda niż mieszanie C# z HTML, jak to było we wcześniejszych wersjach.

One thought on “ASP.NET MVC 6 Tag Helpers”

Leave a Reply

Your email address will not be published.