如何为DevExtreme主明细DataGrid配置主、明细共用的数据源？

我来帮你搞定这个主明细网格的数据源绑定问题！看了你的代码后，核心问题有两个：一是明细网格绑定了整个Model集合，而不是当前主行对应的单个Address；二是你可能没让EF Core正确加载OwnerAddress导航属性，导致数据本身就是null。

第一步：修正明细网格的数据源配置 #

在MasterDetail的模板里，DevExtreme会通过data对象传递当前主行的Owner数据。因为OwnerAddress是单个对象（不是集合），而DataGrid需要绑定集合类型的数据源，所以我们要把单个Address包装成数组。修改明细DataGrid的DataSource部分如下：

.MasterDetail(md => {
    md.Enabled(true);
    md.Template(@<text>
        <div class="master-detail-caption"><%- data.FirstName %> <%= data.LastName %>'s Address:</div>
        @(Html.DevExtreme().DataGrid<SmartTracPoc.Models.Address>()
            .ColumnAutoWidth(true)
            .ShowBorders(true)
            .Columns(columns => {
                columns.AddFor(m => m.StreetAddress);
                columns.AddFor(m => m.City);
                columns.AddFor(m => m.State);
                columns.AddFor(m => m.ZipCode);
                columns.AddFor(m => m.Country);
            })
            // 绑定当前行的OwnerAddress，包装为数组（兼容null情况）
            .DataSource(new JS("data.OwnerAddress ? [data.OwnerAddress] : []"))
        )
    </text>);
})

这里做了两个关键调整：

• 把明细DataGrid的泛型改成Address，更贴合数据类型
• 用new JS(...)编写JS表达式，判断OwnerAddress是否存在，存在就包装成数组，不存在则显示空网格

第二步：确保EF Core加载关联数据 #

你需要在后端查询Owner时，显式IncludeOwnerAddress导航属性，否则EF默认不会加载关联数据（懒加载未开启的情况下）。比如在你的Controller里：

public IActionResult Index()
{
    // 必须Include OwnerAddress，否则前端拿到的OwnerAddress是null
    var owners = _context.Owners
        .Include(o => o.OwnerAddress)
        .ToList();
    return View(owners);
}

额外小修正 #

你模板里的<%- data.FullName %>是笔误，你的Owner模型里没有FullName属性，改成<%- data.FirstName %> <%= data.LastName %>就能正确显示所有者姓名了。

现在重新运行项目，主网格展开后就能看到对应的Address数据啦！

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