ASP.NET模板怎么用？高效开发技巧分享

在 ASP.NET 中，”模板”（Template）是一个核心概念，主要用于控制数据的呈现方式，不同技术栈（如 Web Forms、MVC、Razor Pages）有各自的模板实现方式,以下是主要应用场景和示例：

ASP.NET Web Forms 中的模板

主要用于数据绑定控件（如 Repeater, GridView, ListView）定义渲染结构。

示例：Repeater 控件的模板

<asp:Repeater ID="ProductRepeater" runat="server" DataSourceID="ProductDataSource">
    <%-- 头部模板 --%>
    <HeaderTemplate>
        <ul class="product-list">
    </HeaderTemplate>
    <%-- 项模板（每条数据） --%>
    <ItemTemplate>
        <li>
            <h3><%# Eval("ProductName") %></h3>
            <p>价格: <%# Eval("Price", "{0:C}") %></p>
        </li>
    </ItemTemplate>
    <%-- 交替项模板（隔行换色） --%>
    <AlternatingItemTemplate>
        <li class="alternate">
            <h3><%# Eval("ProductName") %></h3>
            <p>价格: <%# Eval("Price", "{0:C}") %></p>
        </li>
    </AlternatingItemTemplate>
    <%-- 尾部模板 --%>
    <FooterTemplate>
        </ul>
    </FooterTemplate>
</asp:Repeater>

关键点：

• HeaderTemplate/FooterTemplate：渲染头部/尾部内容。
• ItemTemplate：定义每条数据的HTML结构。
• AlternatingItemTemplate：交替行样式。
• Eval()：绑定数据字段。

ASP.NET MVC 中的模板

通过 Display Templates 和 Editor Templates 实现模型渲染的标准化。

步骤：

1. 创建模板文件
   在 ~/Views/Shared/DisplayTemplates 或 ~/Views/Shared/EditorTemplates 中添加视图文件（如 DateTime.cshtml）。

2. 自定义 DateTime 显示模板
   ~/Views/Shared/DisplayTemplates/DateTime.cshtml：

   

   @model DateTime?
   @if (Model.HasValue) {
       <span>@Model.Value.ToString("yyyy-MM-dd")</span>
   }

3. 在视图中使用模板

   @Html.DisplayFor(model => model.CreatedDate) <!-- 自动应用DateTime模板 -->

编辑器模板示例：

@model decimal?
<input asp-for="@Model" type="number" step="0.01" />

Razor Pages 中的模板

类似 MVC,通过局部视图和模板文件夹实现组件化。

示例：商品卡片局部视图

/Pages/Shared/_ProductCard.cshtml：

@model Product
<div class="card">
    <h3>@Model.Name</h3>
    <p>@Model.Price.ToString("C")</p>
</div>

在页面中使用：

@foreach (var product in Model.Products) {
    <partial name="_ProductCard" model="product" />
}

通用布局模板（_Layout.cshtml）

定义网站全局布局（MVC/Razor Pages）。

<!DOCTYPE html>
<html>
<head>@ViewBag.Title</title>
</head>
<body>
    <header>...</header>
    <main>
        @RenderBody() <!-- 子页面内容注入点 -->
    </main>
    <footer>...</footer>
    @RenderSection("Scripts", required: false)
</body>
</html>

Blazor 中的模板

通过 RenderFragment 实现组件模板化。

组件定义：

<!-- TemplateList.razor -->
@typeparam TItem
<ul>
    @foreach (var item in Items)
    {
        <li>@ItemTemplate(item)</li>
    }
</ul>
@code {
    [Parameter]
    public IEnumerable<TItem> Items { get; set; }
    [Parameter]
    public RenderFragment<TItem> ItemTemplate { get; set; }
}

使用组件：

<TemplateList Items="@products">
    <ItemTemplate Context="product">
        <span>@product.Name - @product.Price</span>
    </ItemTemplate>
</TemplateList>

通过模板技术，可以实现：
✅ 关注点分离（数据逻辑 vs 呈现逻辑）
✅ UI一致性
✅ 代码复用
✅ 维护便捷性