使用 html 助手设置时间

【问题标题】：Setting time using html helper使用 html 助手设置时间
【发布时间】：2021-10-03 13:07:25
【问题描述】：

我的剃须刀页面上有 html 日期选择器和时间选择器

这样

日期显示正常，但显示时间时出现问题

这是查看代码

 <div class="col-md-2">
   @Html.TextBoxFor(model => model.Attempt1.Date, "{0:yyyy-MM-dd}", new { type = "date", @class = "form-control" })
 </div>
 <div class="col-md-2">
   @Html.TextBoxFor(model => model.Attempt1.Time, "HH:mm", new { type = "time", @class = "form-control" })
  </div>

只需要小时、分钟和上午/下午

在浏览器控制台中，我有一个警告，但它没有说明上午/下午的任何内容。

以前有人遇到过这种错误吗？如果是这样，请建议我需要在 razor 页面中进行的更改。

【问题讨论】：

标签： asp.net-mvc asp.net-core

【解决方案1】：

如果你想用type="time"绑定数据。这里有两种解决方案：

1.将Time设置为TimeSpan类型：

[DataType(DataType.Time)]
[DisplayFormat(DataFormatString = "{0:hh\\:mm}", ApplyFormatInEditMode = true)]
public TimeSpan Time { get; set; }

查看：

@Html.TextBoxFor(model => model.Attempt1.Time, "HH:mm", new { type = "time", @class = "form-control" })

结果（时间默认值：Time=new TimeSpan(12, 11, 0)）：

2.将Time设置为字符串并使用而不是@Html.TextBoxFor：

public string Time { get; set; }

查看：

<input class="form-control" id="Time" name="Time" type="time" value=@Model.Attempt1.Time>

结果（时间默认值：Time="12:11"）：

【讨论】：