ASP.NET MVC缺勤管理系统：EF关联查询替换ID为状态/类型名称

嘿，我来帮你搞定这个需求！要把查询返回的TypeId和StateId换成对应的类型名称、状态名称，核心就是在EF查询里关联RequestType和RequestStates两张表，把需要的名称字段查出来，再传给前端AngularJS渲染就行。下面分两种常见场景给你具体代码：

场景1：实体类已配置导航属性（推荐） #

如果你的EF实体类已经通过数据注解或者Fluent API配置了导航属性（这是EF的最佳实践），那查询会非常简洁：

1. 先确认实体类结构（示例） #

public class Request
{
    public int Id { get; set; }
    public int TypeId { get; set; }
    public int StateId { get; set; }
    public string ApplicantName { get; set; }
    public DateTime RequestDate { get; set; }

    // 导航属性：关联RequestType表
    [ForeignKey("TypeId")]
    public virtual RequestType RequestType { get; set; }
    // 导航属性：关联RequestStates表
    [ForeignKey("StateId")]
    public virtual RequestState RequestState { get; set; }
}

public class RequestType
{
    public int Id { get; set; }
    public string Name { get; set; } // 存储"病假"、"年假"等名称
}

public class RequestState
{
    public int Id { get; set; }
    public string Name { get; set; } // 存储"待审批"、"已批准"等名称
}

2. 修改EF查询代码 #

用Include方法加载关联表，然后通过导航属性获取名称，最后选择需要的字段返回（可以用匿名类型或者DTO）：

// 假设你的DbContext实例是db
var pendingRequests = db.Requests
    // 加载关联的类型和状态表
    .Include(r => r.RequestType)
    .Include(r => r.RequestState)
    // 筛选待处理请求（这里根据你的业务逻辑，比如StateId=1代表待审批）
    .Where(r => r.StateId == 1)
    // 选择需要返回给前端的字段，替换ID为名称
    .Select(r => new {
        r.Id,
        r.ApplicantName,
        r.RequestDate,
        RequestTypeName = r.RequestType.Name, // 替换TypeId为类型名称
        RequestStateName = r.RequestState.Name // 替换StateId为状态名称
    })
    .ToList();

场景2：未配置导航属性（显式Join） #

如果暂时没配置导航属性，也可以用Linq的显式Join来关联三张表：

var pendingRequests = from req in db.Requests
                      join reqType in db.RequestTypes on req.TypeId equals reqType.Id
                      join reqState in db.RequestStates on req.StateId equals reqState.Id
                      where req.StateId == 1 // 筛选待处理请求
                      select new {
                          req.Id,
                          req.ApplicantName,
                          req.RequestDate,
                          RequestTypeName = reqType.Name,
                          RequestStateName = reqState.Name
                      };

3. 传给前端并修改AngularJS渲染 #

在MVC的Action里把查询结果转成Json返回：

public JsonResult GetPendingRequests()
{
    // 上面的查询代码获取pendingRequests
    return Json(pendingRequests, JsonRequestBehavior.AllowGet);
}

然后修改前端AngularJS的表格，把原来绑定TypeId、StateId的地方换成新的名称字段：

<table class="table">
    <thead>
        <tr>
            <th>申请人</th>
            <th>申请类型</th>
            <th>状态</th>
            <th>申请日期</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="request in pendingRequests">
            <td>{{request.ApplicantName}}</td>
            <td>{{request.RequestTypeName}}</td> <!-- 这里用名称代替ID -->
            <td>{{request.RequestStateName}}</td> <!-- 这里用名称代替ID -->
            <td>{{request.RequestDate | date:'yyyy-MM-dd'}}</td>
        </tr>
    </tbody>
</table>

额外建议：使用DTO（数据传输对象） #

如果你的项目比较复杂，建议创建一个专门的DTO类来传输数据，比匿名类型更易维护和扩展：

public class RequestDto
{
    public int Id { get; set; }
    public string ApplicantName { get; set; }
    public DateTime RequestDate { get; set; }
    public string RequestTypeName { get; set; }
    public string RequestStateName { get; set; }
}

然后查询时选择到DTO：

.Select(r => new RequestDto {
    Id = r.Id,
    ApplicantName = r.ApplicantName,
    RequestDate = r.RequestDate,
    RequestTypeName = r.RequestType.Name,
    RequestStateName = r.RequestState.Name
})

这样后续如果需要新增字段，直接修改DTO即可，非常方便。

内容的提问来源于stack exchange，提问作者Hélder Barreto