Angular开发者(也许还有其他人)可以考虑这个部分解决方案。

我的策略是检测输入字段的焦点状态，并相应地在日期和文本类型之间切换。明显的缺点是日期格式会随着输入焦点而改变。

这不是完美的，但确保了一个不错的一致性水平，特别是当你有一些日期显示为文本，也有一些日期输入在你的web应用程序。如果你只有一个日期输入，这不会是很有帮助的。

<input class="form-control"
       [type]="myInputFocus ? 'date' : 'text'"
       id="myInput"
       name="myInput"
       #myInput="ngModel"
       [(ngModel)]="myDate"
       (focus)="myInputFocus = true"
       (blur)="myInputFocus = false">

并且简单地在组件类的开头声明myInputFocus = false。 显然，将myDate指向所需的控件。

如前所述，官方不可能更改格式。然而，它可以对字段设置样式，因此(在一点JS的帮助下)它以我们想要的格式显示日期。这样就失去了操作日期输入的一些可能性，但如果强制使用格式的愿望更强烈，那么这种解决方案可能是一种方法。日期字段只保持这样:

<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09">

剩下的是一些CSS和JS: http://jsfiddle.net/g7mvaosL/

$("input").on("change", function() { this.setAttribute( "data-date", moment(this.value, "YYYY-MM-DD") .format( this.getAttribute("data-date-format") ) ) }).trigger("change") input { position: relative; width: 150px; height: 20px; color: white; } input:before { position: absolute; top: 3px; left: 3px; content: attr(data-date); display: inline-block; color: black; } input::-webkit-datetime-edit, input::-webkit-inner-spin-button, input::-webkit-clear-button { display: none; } input::-webkit-calendar-picker-indicator { position: absolute; top: 3px; right: 0; color: black; opacity: 1; } <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09">

它在台式机的Chrome上运行得很好，在iOS上运行得很好(尤其可取，因为在触摸屏上的本机日期操纵器是无敌的)。没有检查其他的，但是不要期望在任何Webkit上失败。

自帖子活跃2个月前。所以我想也给大家一些建议

在我的情况下，我从读卡器收到的日期是dd/mm/yyyy格式。

我所做的。 如。

Var d="16/09/2019" //收到卡片的日期 函数filldate () { . getelementbyid (cardexpirydate) value = d.split(“/”).reverse () . join(“-”); ｝ <input type="date" id="cardexpirydate"> <br /><br /> <input type="button" value="填写日期" onclick="filldate();" >

代码的作用:

它根据“/”将我得到的日期分割为dd/mm/yyyy(使用split())，并创建一个数组， 然后它反转数组(使用reverse())，因为日期输入支持反转 我所得到的。 然后，它将(使用join())数组连接到一个字符串，根据 输入字段要求的格式

所有这些都在一行中完成。

我想这会对一些人有所帮助，所以我写了这个。

自从这个问题被提出后，web领域发生了很多事情，其中最令人兴奋的是web组件的登陆。现在，您可以使用定制的HTML5元素优雅地解决这个问题，以满足您的需求。如果你想覆盖/改变任何html标签的工作方式，只需使用shadow dom构建你的。

好消息是，已经有很多可用的样板文件，所以很可能你不需要从头开始想出一个解决方案。看看人们在做什么，然后从中获得灵感。

你可以从一个简单(有效)的解决方案开始，比如聚合物的datetime-input，它允许你使用这样的标签:

 <date-input date="{{date}}" timezone="[[timezone]]"></date-input>

或者您可以获得创意和弹出完整的日期选择器样式，如您所希望的，与格式和区域设置，回调，和您的长选项列表(您有一个完整的自定义API在您的处置!)

符合标准，没有黑客。

仔细检查可用的插件，它们支持哪些浏览器/版本，以及它是否覆盖了足够百分比的用户基础……现在是2018年，所以它肯定会覆盖你的大部分用户。

希望能有所帮助!

Firefox的新版本(未知版本)，在设置>语言中，他们增加了一个选项:使用您的操作系统设置“西班牙语(西班牙)”来格式化日期、时间、数字和测量

这个选项将使用操作系统的区域设置来显示日期!太糟糕了，它不是默认启用的(也许从一个新的安装它?)

如上所述，<input type=date…>在大多数浏览器中都没有完全实现，所以让我们来谈谈webkit之类的浏览器(chrome)。

使用linux，您可以通过更改环境变量LANG, LC_TIME似乎不起作用(至少对我来说)。

您可以在终端中键入locale以查看当前值。我认为同样的理念也适用于IOS。

例如: 使用:

LANG=en_US.UTF-8 /opt/google/chrome/chrome

日期显示为mm/dd/yyyy

使用:

LANG=pt_BR /opt/google/chrome/chrome

日期显示为dd/mm/yyyy

您可以使用http://lh.2xlibre.net/locale/pt_BR/(根据您的语言环境更改pt_BR)来创建您自己的自定义语言环境并按照您想要的格式设置日期。

关于如何更改默认系统日期的一个更高级的参考是: https://ccollins.wordpress.com/2009/01/06/how-to-change-date-formats-on-ubuntu/ 而且 https://askubuntu.com/questions/21316/how-can-i-customize-a-system-locale

你可以看到你的真实当前日期格式使用date:

$ date +%x
01-06-2015

但是LC_TIME和d_fmt似乎被chrome拒绝了(我认为这是webkit或chrome中的一个bug)，遗憾的是它不起作用。: ' (

所以，不幸的是，如果LANG环境变量不能解决你的问题，还没有办法。