如何在Telerik ASP.NET Core Grid中设置带颜色的文本超链接？

以下是几种实用的实现方式，适配不同的Grid绑定场景：

1. 服务器端列模板（适合服务器绑定场景） #

直接在Grid列定义中通过Razor模板渲染带样式的超链接：

@(Html.Kendo().Grid<YourEntityModel>()
    .Name("dataGrid")
    .Columns(columns => {
        // 绑定显示文本并自定义模板
        columns.Bound(m => m.LinkDisplayText)
               .Template(@<text>
                   <a href="@item.TargetUrl" style="color: #2196F3; text-decoration: underline;">@item.LinkDisplayText</a>
               </text>)
               .Title("链接");
        // 其他列配置...
    })
    .DataSource(dataSource => dataSource
        .Server()
        .Read(read => read.Action("GetGridData", "YourController"))
    )
)

注：YourEntityModel需包含LinkDisplayText（链接显示文本）和TargetUrl（目标地址）两个属性，可通过style属性直接指定颜色、下划线等样式。

2. 客户端模板（适合Ajax绑定场景） #

如果Grid使用Ajax异步加载数据，用ClientTemplate结合Kendo模板语法实现：

@(Html.Kendo().Grid<YourEntityModel>()
    .Name("ajaxGrid")
    .Columns(columns => {
        columns.Bound(m => m.LinkDisplayText)
               .ClientTemplate("<a href='#= TargetUrl #' style='color: #FF5722; font-weight: bold;'>#= LinkDisplayText #</a>")
               .Title("带颜色链接");
        // 其他列配置...
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("GetAjaxGridData", "YourController"))
    )
)

模板中通过#= 字段名 #绑定模型属性，内联样式可按需调整颜色、字体粗细等。

3. 用CSS类统一管理样式（推荐） #

避免内联样式重复，先定义全局CSS类：

.grid-custom-link {
    color: #4CAF50;
    text-decoration: none;
}
.grid-custom-link:hover {
    color: #388E3C;
    text-decoration: underline;
}

然后在模板中引用该类：

// 服务器端模板写法
.Template(@<text>
    <a href="@item.TargetUrl" class="grid-custom-link">@item.LinkDisplayText</a>
</text>)

// 客户端模板写法
.ClientTemplate("<a href='#= TargetUrl #' class='grid-custom-link'>#= LinkDisplayText #</a>")

内容的提问来源于stack exchange，提问作者Vasily Zaytsev