Kendo MVC Grid列绑定集合/列表异常：评论列表无法显示

我来帮你梳理下这个问题，大概率是几个容易忽略的小细节导致的，咱们一步步来排查：

1. 先解决客户端字段的大小写问题 #

Kendo MVC默认会把C#模型的PascalCase属性转换成客户端JS的camelCase格式（比如后端的Comments到了前端会变成comments），你模板里直接写Comments肯定找不到对应字段！先把模板里的变量改成小写开头的comments试试：

columns.Bound(l => l.Comments).ClientTemplate("# if(comments && comments.length > 0) { # <ul># for(var i=0; i<comments.length; i++){ # <li>#= comments[i] #</li># } # </ul># } else { # 无评论 # } #");

2. 确认Comments列表被正确序列化 #

如果你的Comments是复杂类型集合，要确保后端返回数据时没有忽略这个属性：

• 检查模型的Comments属性有没有加[JsonIgnore]这类会阻止序列化的特性；
• 如果用Ajax绑定Grid，后端Action要正确返回包含Comments的数据集：

public ActionResult GetGridData([DataSourceRequest] DataSourceRequest request)
{
    var data = YourDataService.GetItemsWithComments();
    return Json(data.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

3. 快速调试客户端数据 #

可以先在模板里输出原始数据，看看前端实际拿到的是什么：

columns.Bound(l => l.Comments).ClientTemplate("#= JSON.stringify(comments) #");

运行后看这一列的输出：

• 如果显示undefined：说明字段名不匹配（就是第一步的大小写问题）；
• 如果显示[]：说明后端确实没传过来评论数据；
• 如果显示正常的数组内容：就可以继续完善渲染逻辑。

4. 正确判断空列表的情况 #

JS里空数组[]属于真值，直接写if(comments)会判定为true，所以要改成判断长度：if(comments && comments.length > 0)，这样才能正确区分空列表和有数据的场景。

你可以先试试第一步改大小写，这是Kendo Grid绑定最容易踩的坑！

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