具有角度范围的 HTML5 输入日期格式答案

【问题标题】：HTML5 input date format with angular scope具有角度范围的 HTML5 输入日期格式
【发布时间】：2017-10-26 01:51:44
【问题描述】：

我有一个 HTML 5 input type="date"。

<input type="date" required ng-model="nm.pick" id="dpicker ">

然后在我的角度控制器中，我正在分配值

nm.pick = $filter("date")(Date.now(), 'dd/MM/yyyy');

现在这将给出 HTML5 默认日期格式 yyyy-MM-dd。

但我想要日期格式 - dd/MM/yyyy

我无法在我的 HTML 中将 <input type="date"> 更改为 <input type="text"。如果我更改，dateformat 将正常工作

然后我将输入日期更改为在控制器中输入文本

$("#dpicker").attr("type", "text");
nm.pick = $filter("date")(Date.now(), 'dd/MM/yyyy');

这不起作用。

基本上，我想在控制器中将日期格式更改为dd/MM/yyyy，而不更改 HTML。

实现这一目标的所有可能方法是什么？

【问题讨论】：

您要使用moment吗？
是的，当然..

标签： javascript angularjs html date datetime

【解决方案1】：

我知道的最好方法是使用momentjs。我已经将它与 angular 1.x.x 一起使用，没有任何问题。它很容易使用，看看这个。您可以添加以下行：

nm.pick = moment(nm.pick).format('DD-MM-YYYY');

这应该可以解决您的问题，

【讨论】：

是的..有什么简单的方法可以使用 moment js 来解决我的问题吗？
Error: [ngModel:datefmt] Expected "2017-04-23T00:00:00.000Z"` 成为一个日期`我得到这个错误......我必须输入新的日期（日期）吗？
@Arun，看看这个帖子：stackoverflow.com/questions/30537886/… 看来这个问题已经有了答案

【解决方案2】：

对于type="date"绑定

var app = angular.module("MyApp", []).controller("MyCtrl", function($scope, $filter) {
  $scope.nm = {};
  $scope.nm.pick = new Date($filter('date')(new Date(), "yyyy-MM-dd"));
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>


<body ng-app="MyApp" ng-controller="MyCtrl">
    <input type="date" required ng-model="nm.pick" id="dpicker ">
</body>

阅读其他答案后，我建议使用 moment.js，因为它是一个专家库，在玩弄日期/时间和不同时区时。

【讨论】：

$filter 在我的情况下不起作用，正如我上面提到的。也无法通过 momentjs 更改格式
您使用的是哪个版本的 Angular.. 这在 1.3 以上应该可以正常工作
我使用的是 1.3.8