Blazor中input type=time用@bind-value绑定字符串报错求助

首先咱们来拆解两种写法差异的核心原因：

为什么直接写 <input value="08:00" type="time"/> 能正常工作？ #

这是原生HTML的原生行为——type="time" 的输入框本身就支持直接接收符合格式的字符串（比如 HH:mm 或 HH:mm:ss）作为 value 属性值，浏览器会自动解析这个字符串并渲染对应的时间选择器，不需要额外的类型转换。

为什么用 @bind-value 绑定字符串会报错？ #

Blazor的双向绑定机制对不同类型的输入控件有预设的类型映射规则：对于 type="time" 的输入框，框架默认期望绑定的是 DateTime 或者 TimeSpan 类型，而不是字符串。

当你尝试绑定 string 类型的 StartValue 时，Blazor内部会自动尝试把输入框返回的字符串值转换成它期望的 DateTime 类型（反向绑定），同时也会尝试把你的 string 值转换成 DateTime 来同步到输入框（正向绑定），这两步类型转换都会失败，所以就抛出了 "cannot convert from 'string' to 'System.DateTime'" 的错误。

解决办法 #

方案1：改用 TimeSpan 类型绑定（推荐）

其实 TimeSpan 是完全可以正常绑定的，可能你之前的初始化写法有问题。试试这样写：

<input @bind-value="@StartValue" @bind-value:event="onchange" class="col-sm-1" type="time"/>
@code {
    public TimeSpan StartValue { get; set; } = TimeSpan.Parse("08:00");
}

Blazor会自动处理 TimeSpan 和输入框字符串之间的转换，双向绑定就能正常工作了。

方案2：手动处理绑定（坚持用string的话）

如果一定要用 string 类型，可以绕开Blazor的自动类型转换，手动拆分绑定逻辑：

<input value="@StartValue" @onchange="HandleTimeChange" class="col-sm-1" type="time"/>
@code {
    public string StartValue { get; set; } = "08:00";

    private void HandleTimeChange(ChangeEventArgs e)
    {
        StartValue = e.Value?.ToString() ?? string.Empty;
    }
}

这种写法和原生HTML的行为完全一致，直接用字符串处理输入框的取值和赋值，不会触发Blazor的类型转换逻辑。

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