Question

我要求用户设置日期＆amp;日期范围开始和结束的时间。由于firefox和IE目前不支持输入类型datetime-local，因此我无法使用它。所以我希望在日期和时间输入中共享一个日期模型。

像这样：

＆＃13;

  angular.module('date.deleter', [])
    .controller('DateDeleteController', function($scope) {
      //force display to be a bit more human-readable
      var loadedAt = new Date(new Date().toISOString().slice(0, 19));
      $scope.data = {
        theDate: loadedAt,
        minDate: loadedAt
      };
    })

＆＃13;

<!DOCTYPE html>
<html>

<head>
  <script data-require="angular.js@1.4.6" data-semver="1.4.6" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-app="date.deleter" ng-form="dateDeletingForm">
  <div ng-controller="DateDeleteController">
    <h1>Change Something And Watch Date Dissappear o_O</h1>
    <input type="date" id="theDate" name="theDate" ng-model="data.theDate" min="{{data.minDate | date:'yyyy-MM-dd'}}" placeholder="yyyy-MM-dd">
    <input type="time" id="theStartTime" name="theStartTime" ng-model="data.theDate" min="{{data.minDate | date:'HH:mm:ss'}}" placeholder="HH:mm:ss">

    <h3>output the scope here</h3>
    <pre>{{data}}</pre>

</html>

＆＃13;

在代码段中，我将单个日期对象设置为日期和时间输入的模型。然后将范围数据对象输出到div中，以便我可以看到发生了什么。我还将输入的最小值设置为它们加载的日期和时间。

如果您加载了代码段然后更改了值，您会注意到在某些设置中，不仅输入标记为无效，而且日期对象完全从范围中消失。撤消更改时有时会返回。

这是预期的行为吗？我是否试图在揭露一个单独的日期时做一些疯狂的事情。时间输入为单个日期时间模型？

Answer 1

所以，为了让那些可能通过谷歌结束的人们的利益，我试图做一些疯狂的事情！

documentation for the time input说：

模型必须是Date对象。此绑定将始终将Date对象输出到1970年1月1日的模型或本地日期新日期（1970,0,1，HH，mm，ss）

因此，如果更改时间字段，则绑定模型的日期可能设置为1/1/1970。我也注意到时区也在应用，所以有时在时间字段中设置00:15实际上会在前一天23:15设置。

但是，如果模型被标记为无效，它将从范围中消失。我觉得这很奇怪，但我现在知道了。

将角度的日期和时间绑定到单个日期模型

1 个答案: