ASP.NET Core 标记帮助程序(TagHelper)数据列表支持，循环数据
使用 TagHelperContext.Items 属性。查看官方文档
获取用于与其他 ITagHelper 通信的项的集合。 此 System.Collections.Generic.IDictionary<TKey, TValue> 是写入时复制，以确保添加到此集合的项目仅对其他针对子元素的 ITagHelper 可见。
这意味着我们可以将对象从父标记帮助程序(TagHelper)传递给它的子标记帮助程序(TagHelper)
举个例子
假如我们想遍历 最新文章列表 ArticleInfo
C# 全选
public class Article
{
/// <summary>
/// 文章ID
/// </summary>
public string ID { get; set; }
/// <summary>
/// 文章标题
/// </summary>
public string ArticleTitle { get; set; }
/// <summary>
/// 创建人
/// </summary>
public string CreateUserName { get; set; }
/// <summary>
/// 创建时间
/// </summary>
public string CreateTime { get; set; }
}在Razor视图中cshtml，我们可以这样使用：
HTML 全选
<article-list>
<article-data></article-data>
</article-list>HTML渲染输出结果：
HTML 全选
<ul>
<li><span>U-CMS-2022001：</span><span>U-CMS内容管理系统介绍</span></li>
<li><span>U-CMS-2022002：</span><span>U-CMS系统Windows服务器部署</span></li>
<li><span>U-CMS-2022003：</span><span>U-CMS系统插件开发</span></li>
<li><span>U-CMS-2022004：</span><span>U-CMS问题提交</span></li>
</ul>
两个标记帮助程序代码
更进一步，可控制输出
到目前位置虽然我们已经实现了标记程序的嵌套和循环输出，但是输出格式是固定的，如果能在视图(cshtml)中来决定要输出哪些属性，以及以什么方式输出，那岂不是完美
实现目标如下：
1、可指定输出属性
2、可定制内容UI
在Razor视图中cshtml，我们可以这样使用：
article-list-customer 和 article-value 两个帮助标记程序
article-list-customer：负责数据源的采集
article-value：负责按指定属性输出，property-name为要输出的属性
HTML 全选
<table>
<thead>
<tr>
<th>文章ID</th>
<th>文章标题</th>
<th>创建人</th>
<th>创建日期</th>
</tr>
</thead>
<tbody>
@*循环列表*@
<article-list-customer>
<tr>
<td style="color:green;">
@*输出文章[ID]属性*@
<article-value property-name="ID"></article-value>
</td>
<td style="font-weight:bold;">
@*输出文章[标题]属性*@
<article-value property-name="ArticleTitle"></article-value>
</td>
<td>
@*输出文章[创建人]属性*@
<article-value property-name="CreateUserName"></article-value>
</td>
<td>
@*输出文章[创建日期]属性*@
<article-value property-name="CreateTime"></article-value>
</td>
</tr>
</article-list-customer>
</tbody>
</table>HTML渲染输出结果：
HTML 全选
<table>
<thead>
<tr>
<th>文章ID</th>
<th>文章标题</th>
<th>创建人</th>
<th>创建日期</th>
</tr>
</thead>
<tbody>
<tr>
<td style="color:green;">
U-CMS-2022001
</td>
<td style="font-weight:bold;">
U-CMS内容管理系统介绍
</td>
<td>
U-CMS
</td>
<td>
2022-01-01
</td>
</tr>
<tr>
<td style="color:green;">
U-CMS-2022002
</td>
<td style="font-weight:bold;">
U-CMS系统Windows服务器部署
</td>
<td>
U-CMS
</td>
<td>
2022-01-01
</td>
</tr>
<tr>
<td style="color:green;">
U-CMS-2022003
</td>
<td style="font-weight:bold;">
U-CMS系统插件开发
</td>
<td>
U-CMS
</td>
<td>
2022-01-01
</td>
</tr>
<tr>
<td style="color:green;">
U-CMS-2022004
</td>
<td style="font-weight:bold;">
U-CMS问题提交
</td>
<td>
U-CMS
</td>
<td>
2022-01-01
</td>
</tr>
</tbody>
</table>
两个标记帮助程序代码
版权声明：本文为YES开发框架网发布内容,转载请附上原文出处连接
post 管理员
