Angular+C#餐厅订位系统可用桌查询功能异常修复求助

核心问题：前后端参数传递不匹配 #

后端Controller使用[FromQuery]标记参数，但前端通过POST请求将参数放在请求体中，导致后端无法正确接收查询参数，最终触发reservations.Any() == false分支返回全部桌位。

修复1：调整后端Controller参数绑定方式 #

将[FromQuery]改为[FromBody]，并创建DTO类统一接收参数（更符合REST规范）：

步骤1：创建查询参数DTO

public class TableAvailabilityQuery
{
    public int NumberOfGuests { get; set; }
    public DateTime Date { get; set; }
    public TimeSpan Time { get; set; }
}

步骤2：修改Controller方法

[HttpPost("available")]
public async Task<IEnumerable<Table>> GetAvailableTables([FromBody] TableAvailabilityQuery query)
{
    return await _tableRepo.GetAvailableTables(query.NumberOfGuests, query.Date, query.Time);
}

前端参数格式修正 #

前端time参数存在类型不匹配问题：HTML中select的选项值为字符串（如"13:30:00"），但Component中time声明为Date类型，导致传递给后端的格式错误。

修复2：调整前端参数处理逻辑 #

修改Component中的time类型

// 将time类型改为string，匹配select选项值类型
time: string = "13:30:00";

修改Service中的请求参数处理

getAvailableTables(numberOfGuests: number, date: Date, time: string): Observable<Table[]> {
    const formattedDate = date.toISOString().split('T')[0];
    // 直接传递time字符串，后端会自动解析为TimeSpan
    const body = {
        numberOfGuests,
        date: formattedDate,
        time
    };
    return this.http.post<Table[]>(this.baseUrl + 'table/available', body);
}

后端Repository逻辑补全 #

当没有匹配的预订记录时，当前代码直接返回全部桌位，忽略了numberOfGuests的容量过滤条件，不符合需求。

修复3：修正Repository查询逻辑 #

public async Task<IEnumerable<Table>> GetAvailableTables(int numberOfGuests, DateTime date, TimeSpan time)
{
    var reservations = await _context.Reservations.Where(x => 
        x.ReservationDate == date &&
        (
            (x.ReservationTime <= time && time < x.ReservationTime + TimeSpan.FromHours(5)) ||
            (time >= x.ReservationTime - TimeSpan.FromHours(5) && time < x.ReservationTime)
        )).ToListAsync();

    var reservedTableIds = reservations.Select(r => r.TableId);
    // 无论是否有预订，都过滤容量≥人数的桌位
    var availableTables = await _context.Tables
        .Where(t => !reservedTableIds.Contains(t.Id) && t.Capacity >= numberOfGuests)
        .ToListAsync();

    return availableTables;
}

额外验证点 #

1. 确认前端请求的参数名称与后端DTO属性名称一致（ASP.NET Core会自动映射camelCase与PascalCase）。
2. 在Controller方法中添加断点或日志，验证接收的参数值是否正确。
3. 检查数据库中ReservationDate和ReservationTime的存储格式，避免日期时间比较时的时区或格式问题。

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