В чем преимущество использования помощников тегов в ASP.Net MVC 6

Извинился, что я не очень хорош в asp.net mvc, о котором я хотел бы признаться. Я просто столкнулся с хорошей записью для новой функции asp.net 5 из этого URL.

Оттуда я услышал о термине под названием Tag Helpers in ASP.Net MVC 6, и я видел там, что люди говорят, прежде чем разработчик создаст форму следующим образом:

@model MyProject.Models.Product

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => p.Name, "Name:")
        @Html.TextBoxFor(m => p.Name)
    </div>
    <input type="submit" value="Create" />
}

и теперь люди могут запрограммировать то же самое с помощником тега ниже.

@model MyProject.Models.Product
@addtaghelper "Microsoft.AspNet.Mvc.TagHelpers"

<form asp-controller="Products" asp-action="Create" method="post">
    <div>
        <label asp-for="Name">Name:</label>
        <input asp-for="Name" />
    </div>

    <input type="submit" value="Save" />
</form>

Они используют несколько новых синтаксисов под названием asp-controller, asp-for etc, но что он будет делать? Как и почему людям будет выгодно использовать этот новый синтаксис asp-controller, asp-for etc.

Итак, пожалуйста, помогите мне понять эту новую концепцию помощника тега и как это облегчит жизнь разработчика. Спасибо.

Ответ 1

Самое важное улучшение, которое я видел до сих пор, - это контроль, который он гарантирует над вашими HTML-элементами. Хотя удобно, Html-помощники, используемые MVC, создают проблемы, когда вы пытаетесь сделать то, для чего они не были созданы.

Простой пример можно увидеть при использовании TextBox в MVC5:

 @Html.TextBoxFor(m => p.Name)

Полученная HTML-разметка выглядит следующим образом:

<input class="form-control" id="Name" name="Name" type="text" value="">

Приятный и простой. Но что, если вы хотите добавить атрибут placeholder? Что делать, если вы хотите использовать состояния проверки подлинности bootstrap? Что делать, если у вас есть сторонняя супер-классная библиотека javascript, которая нуждается в настраиваемых атрибутах. Ничего из этого не было возможно в начальном выпуске MVC5.. Хотя они были добавлены через обновление в виде htmlAttributes. Даже сейчас добавление пользовательских атрибутов в лучшем случае - kludgey.

@Html.TextBoxFor(m => p.Name, 
    new {@class="form-control has-error", placeholder="Enter Name", 
    superCoolFeature="Do something cool"})

Пока вы можете утверждать, что это еще меньше кода, который является прямым HTML, это уже не значительное преимущество. Хуже того, это решение по-прежнему не охватывает тире в атрибутах, которые довольно распространены. Если они вам нужны, вы застряли в обходном пути, например ActionLink htmlAttributes

Я пошел по пути исправления этих недостатков с помощью специальных редакторов и попытался создать собственные элементы управления TextBox. Стало очевидным довольно быстро, что замена включенных шаблонов TextBox потребует большой работы. Хуже того, ваши шаблоны должны знать любые расширения, которые вы добавляете для их использования.

Похоже, что включение Bootstrap и других сторонних инструментов в MVC сделало более очевидным, что в текущем дизайне есть проблемы с расширением HTML, который необходимо исправлять. Надеемся, что реализация помощников тегов достаточно полна, и мы можем избежать их в будущем.

Ответ 2

Не говоря уже о том, что ваш веб-сайт Дизайнеры будут иметь реальные HTML-теги для редактирования, которые они признают для перепроектирования ваших страниц. Дизайнеры не должны быть кодовыми и достаточно для того, чтобы эти острые люди не отставали, изучая движущиеся цели спецификаций HTML5 и CSS3.

Ответ 3

Приходят в голову несколько вещей:

Как отмечает @ChrisWalter, эти агенты тегов дают HTML-тегам открытое/закрытое качество. Вместо того, чтобы просто позволить вам писать методы расширения для общих шаблонов HTML, вы можете расширить элемент HTML. Это позволяет вам выбирать и смешивать несколько расширений для каждого компонента, а не выбирать между ними.
Помощники HTML обычно не очень хорошо работают для элементов, которые должны иметь внутренний HTML, предоставленный в качестве аргумента. Они придумали умную модель, чтобы вы могли сказать:
```
@using (Html.BeginForm(...)){
{
    <input ... />
}
```
Но нет ничего о BeginForm(), который заставит вас поместить его в оператор using, и вам нечего мешать использовать неправильную структуру HTML. (<input> технически не разрешено быть непосредственно внутри тега <form>.)
Это дает нам очень простой переходный шаг в мир веб-компонентов HTML5. Компонент, который вы пишете сегодня для jQuery или Bootstrap для получения и улучшения, может занять несколько секунд в качестве компонента Agular 2 или Polymer. Использование синтаксиса HTML позволяет писать HTML-код так, как вы хотите, чтобы он выглядел, когда он является веб-компонентом, и автоматически переводил его в структуру, на которую он должен теперь наступить (или для определенных браузеров, позже).