در قسمت قبلی دوره ASP.NET CORE در خصوص Html Helper ها صحبت کردیم. از مشکلات که Html Helper ها این بود که فرانت کار با C# آشنایی نداشتند و باید زمانی را صرف یادگیری Html Helper ها میکردند. از این رو شرکت مایکروسافت ابزار جدیدی به نام TAG Helper ها را معرفی کرد. که دقیقا کار Html Helper ها را انجام میدهد ولی درک آن بسیار ساده تر است. در ادامه با آموزش TAG Helper با ما همراه باشید.
TAG Helper در ASP.NET Core ابزاری هستند که به شما کمک میکنند تا کدهای HTML خود را با استفاده از دستورات C# به صورت داینامیک و قویتر تولید کنید. و به شما اجازه میدهند تا از امکانات قدرتمند زبان C# برای تولید کدهای HTML استفاده کنید، به طوری که کدهای HTML شما تمیزتر و خواناتر باشند.
تگهلپرها کامپوننتهای سمت سروری هستند که پردازش آنها باعث ایجاد تگهای Html میگردد. عملگرد آنها شبیه به Html Helper ها بوده ولی ساختار نوشتاری آنها در اکثر قسمتها مانند تگهای Html میباشد. این قابلیت، استفاده از تگهلپرها را برای توسعه دهندگان ساده تر میکند.
TAG Helper ها توسعه HTML را به صورت کاربرپسند ارائه می دهد و مانند HTML استاندارد به نظر می رسند. طراحان front-end که با فریم روک و کتابخانه های JavaScript و CSS و غیره کار میکنند میتوانند به آسانی View را بدون دانستن زبان #C تغییر و یا بروزرسانی نمایند.
در ASP.NET Core، تعدادی Tag Helper از پیش تعریف شده وجود دارد که برای کار با فرمها، لینکها، نمایش اعتبارسنجی، و بسیاری موارد دیگر طراحی شدهاند. این Tag Helper ها به شما اجازه میدهند که کد HTML را به صورت داینامیک و با استفاده از کدهای C# مدیریت کنید. در ادامه، لیست Tag Helper های پیشفرض که در ASP.NET Core موجود هستند، آورده شده است:
<form asp-controller="Home" asp-action="Index">
<!-- فیلدهای فرم -->
</form>
<input asp-for="UserName" />
<textarea asp-for="UserDescription"></textarea>
<label asp-for="UserName"></label>
<select asp-for="UserRole" asp-items="Model.Roles"></select>
<select asp-for="UserRole">
<option value="Admin">Admin</option>
<option value="User">User</option>
</select>
<button asp-controller="Home" asp-action="Index">Go to Home</button>
برای نمایش پیامهای اعتبارسنجی برای یک فیلد در تگ Span استفاده میشود.
<span asp-validation-for="UserName"></span>
برای نمایش خلاصه پیامهای اعتبارسنجی در تگ های Div و یا UL استفاده میشود.
<div asp-validation-summary="All"></div>
<a asp-controller="Home" asp-action="About">About</a>
<link href="~/css/site.css" rel="stylesheet" />
<partial name="_LoginPartial" />
<environment include="Development">
<script src="~/js/dev-only.js"></script>
</environment>
<cache expires-after="@TimeSpan.FromSeconds(10)">
<p>Cached content at @DateTime.Now</p>
</cache>
<distributed-cache expires-after="@TimeSpan.FromSeconds(10)">
<p>Distributed cached content at @DateTime.Now</p>
</distributed-cache>
<script src="~/js/site.js" asp-append-version="true"></script>
<style asp-append-version="true">
@import url('~/css/site.css');
</style>
<a asp-route-id="1" asp-route-name="HomeRoute">Home</a>
<img src="~/images/logo.png" asp-append-version="true" />
<head>
<meta charset="utf-8" />
<title>My App</title>
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
<h1>Welcome to My App</h1>
</body>