ASP.NET Core 6：将视图绑定为List而非IEnumerable实现表格行选择

一、先搞定LINQ转List失败的问题 #

你遇到的ToList()失败，大概率是LINQ查询的投影环节出了问题，常见原因和修复方式：

• 检查是否误写了匿名类型：确保LINQ查询里是select new EventListViewModel { ... }而非select new { ... }，匿名类型无法直接转成List<EventListViewModel>
• 排查EF Core查询兼容性：如果查询里用了EF Core不支持的客户端方法，先调用AsEnumerable()再投影（但尽量先投影再ToList，避免加载全表数据）

示例控制器代码：

public IActionResult Index()
{
    var eventList = _dbContext.Events
        .Join(_dbContext.Clients,
            e => e.ClientId,
            c => c.Id,
            (e, c) => new EventListViewModel
            {
                EventId = e.Id,
                EventTitle = e.Title,
                ClientName = c.FullName,
                // 其他属性按需映射
            })
        .ToList(); // 此时投影类型明确，ToList()应该能正常执行

    return View(eventList);
}

二、不依赖索引的行选择实现（推荐） #

用索引做行选择的弊端很明显：分页、排序后索引会失效，更可靠的方式是用实体的**唯一标识（比如EventId）**来跟踪选中状态：

视图层（绑定IEnumerable或List都可以） #

<table>
    @foreach (var item in Model)
    {
        <tr class="selectable" data-event-id="@item.EventId">
            <td>@item.EventTitle</td>
            <td>@item.ClientName</td>
            <!-- 其他列 -->
        </tr>
    }
</table>

前端JS逻辑 #

// 切换选中样式+收集选中ID
$('.selectable').click(function() {
    $(this).toggleClass('selected');
    
    // 收集所有选中的EventId
    const selectedIds = $('.selectable.selected').map(function() {
        return $(this).data('event-id');
    }).get();
    
    // 后续可将selectedIds提交到后端或做其他处理
    console.log('选中的事件ID：', selectedIds);
});

这种方式完全脱离索引依赖，数据变化后依然能准确跟踪选中项，是生产环境更稳妥的方案。

三、保留索引需求的优雅实现 #

如果一定要用索引，不用额外封装ViewModel，有两种简洁方式：

方式1：视图绑定List，用for循环 #

@model List<EventListViewModel>

<table>
    @for (int i = 0; i < Model.Count; i++)
    {
        <tr class="selectable" data-index="@i">
            <td>@Model[i].EventTitle</td>
            <td>@Model[i].ClientName</td>
        </tr>
    }
</table>

直接通过循环下标获取索引，避免IndexOf的引用比较问题（默认IndexOf对引用类型按内存地址比较，即使属性相同也可能返回-1）。

方式2：用IEnumerable的Select重载带索引 #

即使视图绑定的是IEnumerable<EventListViewModel>，也可以通过Select的重载方法直接获取索引，不用转List：

@model IEnumerable<EventListViewModel>

<table>
    @foreach (var (item, index) in Model.Select((item, idx) => (item, idx)))
    {
        <tr class="selectable" data-index="@index">
            <td>@item.EventTitle</td>
            <td>@item.ClientName</td>
        </tr>
    }
</table>

这种方式保持了IEnumerable的延迟加载特性，同时也能拿到可靠的索引。

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