HTML Input[Date] 默认为 mm/dd/yyyy，尽管区域设置答案

【问题标题】：HTML Input[Date] defaulting to mm/dd/yyyy despite locale settingsHTML Input[Date] 默认为 mm/dd/yyyy，尽管区域设置
【发布时间】：2020-02-03 04:30:31
【问题描述】：

我在 ng-repeat 场景中使用 html 日期输入，尽管我的计算机区域设置设置为 dd/mm/yyyy，但它似乎默认为 mm/dd/yyyy。

<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app>
    <input class="form-control" type="date" ng-model="attendee.Dob"/>
</body>

有没有简单的方法来重新格式化？我似乎找不到任何有用的东西，因为一切都表明<input> 元素应该使用我的本地日期选择器设置。

抱歉，如果我在这里遗漏了什么。

【问题讨论】：

依靠浏览器观察区域设置进行格式化是令人担忧的，只是不要这样做。即使它对多种语言都可靠地工作，您也取决于用户是否对其进行了适当的设置。最好使用明确的格式（例如 2020 年 1 月 27 日）并保持不变。即使尝试使用默认语言也是令人担忧的，因为没有设置它的标准，也没有实现需要或必须支持的语言。
谢谢@RobG。您是否有任何示例说明如何最好地实现这一点？
不，尽管您可以尝试航空公司和旅行预订网站，但我讨厌不允许我使用键盘输入日期的网站。我的重点是可用性和明确性。格式的本地化导致了一个无限复杂的兔子洞，并且由于 MDN 上给出的原因，默认的 HTML 日期输入实际上毫无价值。有大量的库、插件、小部件等来完成这项工作。我不能在这里推荐一个，只需搜索并选择一个。如果您有问题，请再次发布。 :-)

标签： javascript html angularjs date input

【解决方案1】：

来自文档：

日期输入听起来很方便——它们为选择日期提供了一个简单的界面，并且无论用户的语言环境如何，它们都会规范发送到服务器的数据格式。但是，由于浏览器支持有限，<input type="date"> 目前存在问题。

不支持的浏览器会优雅地降级为文本输入，但这会在用户界面的一致性（呈现的控件不同）和数据处理方面产生问题。

第二个问题比较严重；在支持日期输入的情况下，该值被标准化为格式yyyy-mm-dd。但是对于文本输入，浏览器无法识别日期应该采用什么格式，并且人们可以使用许多不同的格式来编写日期。

目前，以跨浏览器方式处理表单中日期的最佳方法是让用户在单独的控件中输入日、月和年，或者使用 JavaScript 库，例如 jQuery 日期选择器.

有关详细信息，请参阅

MDN HTML Reference - <input type="date"> Browser Support

【讨论】：

【解决方案2】：

<script src="//unpkg.com/angular/angular.js"></script>
    <body ng-app>
        <!--
          ddmmyyyy
          dd/mm/yyyy
          mm/dd/yyyy
          dd-mm-yyyy
          mm-dd-yyyy
          Month dd, yyyy
        -->
         <input type="date" name="bday"  ng-model="attendee.Dob" required pattern="\d{4}-\d{2}-\d{2}">
         <br>
         <p> Date :  {{attendee.Dob | date:'MM/dd/yyyy'}}</p>
    </body>

【讨论】：

我知道这会在手动选择时将日期更改为正确的格式，但日期选择器在首次启动时仍显示 mm/dd/yyyy。习惯于 dd/mm/yyyy 格式的手动键入日期的人仍然会遇到问题。