Shulou(Shulou.com)06/01 Report--

This article mainly shows you "ASP.NET Core MVC how to customize Tag Helpers", the content is simple and easy to understand, organized clearly, I hope to help you solve doubts, let Xiaobian lead you to study and learn "ASP.NET Core MVC how to customize Tag Helpers" this article bar.

introduced

By creating custom Tag Helpers, we can extend existing elements or create our own.

Tag Helper is a collective name for classes that implement the ITagHelper interface. MVC provides us with the abstract class TagHelper for this interface, which is located in the Microsoft.AspNetCore.Razor.Runtime assembly. So, we can inherit directly from the TagHelper class, we mainly need to implement the following methods:

public virtual void Process(TagHelperContext context, TagHelperOutput output); public virtual Task ProcessAsync(TagHelperContext context, TagHelperOutput output);

Process methods are concrete logical implementations. It needs to pass an instance of the Tag Helper context and the Tag Helper output (which we can use to read and change the actual content within the Tag Helper scope).

simple example

We create our own Tag Helper. Assuming we are going to use Tag Helper, the content will be bold.

We are going to create a new project called CustomTagHelpers. Therefore, the assembly name will also be CustomTagHelpers.

First, we create a new Tag Helper. With Visual Studio, we can add- > New Item- > Web - > Razor Tag Helper like this.

This is the default generated code:

public class SimpleTagHelper : TagHelper { public override void Process(TagHelperContext context, TagHelperOutput output) { } }

What we need to do is set the output label name to strong:

public class SimpleTagHelper : TagHelper { public override void Process(TagHelperContext context, TagHelperOutput output) { output.TagName = "strong"; } }

To be able to use the newly created Tag Helper in our view, we must add the following line to the ViewImports.cshtml file:

@addTagHelper *, CustomTagHelpers

Notice two strings after the_ @addTagHelper _directive:

Its second part, CustomTagHelpers, indicates from which assembly name the Tag Helper is loaded;

The first string after the_ @addTagHelper _directive indicates the name of the TagHelper to load, and the wildcard (*) indicates that we will use all TagHelpers in a given assembly.

If we now go to one of these pages and write:

CodingBlast

We will see in Visual Studio that the label for this **simple ** has turned purple and is recognized as Tag Helper. If we run the application, we will display this text in bold.

If we look at the HTML output, we can see that the simple tag has been replaced by strong:

CodingBlast Change Properties

Let's build another Tag Helper as an alternative to the img tag. We will add a new Tag Helper named CuteTagHelper.

using Microsoft.AspNetCore.Razor.TagHelpers;namespace CustomTagHelpers.TagHelpers{ [HtmlTargetElement("cute")] public class CuteTagHelper : TagHelper { public string ImageLink { get; set; } public string AlternativeText { get; set; } public override void Process(TagHelperContext context, TagHelperOutput output) { output.TagName = "img"; output.TagMode = TagMode.StartTagOnly; output.Attributes.SetAttribute("src", ImageLink); output.Attributes.SetAttribute("alt", AlternativeText); } }

If I now go to the_.cshtml_file and start typing:

You can see that **cute ** is purple, indicating that Visual Studio thinks it is a Tag Helper. In addition, it provides intelligent hints for the two attributes we specified in the CuteTagHelper class.

Any public attribute we specify in the TagHelper class will appear as an attribute in the.cshtml file.

summary

With Tag Helper, we can extend existing elements or create new elements with attributes

Once we create a Tag Helper, we usually have a reusable attribute or element

The TagHelper class included with MVC provides methods and properties for writing Tag Helpers

Tag Helpers use naming conventions (just like controllers in MVC), so if you use the class name CoolTagHelper, you'll be able to use tags in your code.

The above is "ASP.NET Core MVC how to customize Tag Helpers" all the content of this article, thank you for reading! I believe that everyone has a certain understanding, hope to share the content to help everyone, if you still want to learn more knowledge, welcome to pay attention to the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.