五、自定义标签
上一节最终形成了一个名为BookCodeTagHelper的TagHelper，我们知道LabelTagHelper是可以按名称默认匹配label标签的，那么是否可以自定义一个BookCode标签呢？在index.cshtml中添加这样的代码：
<BookCode>1003</BookCode>
由于自定义bookcode标签的目的就是专门显示Book的Code，所以也不必添加show-type属性了。然后修改BookCodeTagHelper，修改后的代码如下：
public class BookCodeTagHelper : TagHelper { public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output) { output.Attributes.SetAttribute("class", "codeColor"); string content = output.Content.IsModified ? output.Content.GetContent() : (await output.GetChildContentAsync()).GetContent(); ; output.Content.SetContent("BJ" + content); } }
去掉了两个HtmlTargetElement设置并取消了对show-type的判断，访问index页面查看新建的bookcode标签是否会被处理，结果是没有被处理。这是为什么呢？
这是由于TagHelper会将采用Pascal 大小写格式的类和属性名将转换为各自相应的短横线格式。即“BookCode”对应“book-code”，获取标签的属性值，同样遵循这样的规则。所以将标签改为如下写法即可：
<book-code>1003</book-code>
再次运行测试，发现这个新标签被成功处理。查看网页源代码，被处理后的Html代码是这样的：
<book-code class="codeColor">TJ1003</book-code>
如果想将其改变为label，可以在BookCodeTagHelper中通过指定TagName实现：
public class BookCodeTagHelper : TagHelper { public Book Book { get; set; } public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output) { output.TagName = "label"; output.Attributes.SetAttribute("class", "codeColor"); string content = output.Content.IsModified ? output.Content.GetContent() : (await output.GetChildContentAsync()).GetContent(); ; output.Content.SetContent(Book.Prefix + content); } }
六、TagHelper与页面之间的数据传递
假如现在的新需求是图书编码的前缀不再固定为“BJ”了，需要在标签中定义，例如这样：
<book-code prefix="SH">1003</book-code>
需要获取prefix的值，在上面的例子中采用的是TryGetAttribute方法，其实还有简单的方式，修改BookCodeTagHelper，代码如下：
public class BookCodeTagHelper : TagHelper { public string Prefix { get; set; } public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output) { output.Attributes.SetAttribute("class", "codeColor"); string content = output.Content.IsModified ? output.Content.GetContent() : (await output.GetChildContentAsync()).GetContent(); ; output.Content.SetContent(Prefix + content); } }
标签中的prefix的值会自动赋值给BookCodeTagHelper.Prefix，是不是更方便了。那么如果是Model中的值呢？假如Book类有一个属性“public string Prefix { get; set; } ”，这和传入一个字符串没什么区别，那么可以这样写：
<book-code prefix="@Model.Prefix">1003</book-code>
这种传值方式不止是支持字符串，将Model整体传入也是支持的，将标签修改如下：
<book-code book="@Model">1003</book-code>
修改BookCodeTagHelper代码：
public class BookCodeTagHelper : TagHelper { public Book Book { get; set; } public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output) { output.Attributes.SetAttribute("class", "codeColor"); string content = output.Content.IsModified ? output.Content.GetContent() : (await output.GetChildContentAsync()).GetContent(); ; output.Content.SetContent(Book.Prefix + content); } }
