手动选择输入日期到最大值返回未定义

Question

我有两个日期选择器，设置了最大值和最小值。如果将"开始日期最大值"设置为特定日期，并且我手动选择该日期，则返回无效日期。选择任何其他日期将返回正确的值。(例如 - 如果最大设置是 10 月 24 日并且我手动选择它，那么它返回未定义(

<div class="col-sm-2">
<h6>From Date</h6>
<input type="date" onkeydown="return false" id="fromDate" class="form-control" ng-change="fdateSel()" max="{{fmaxdate}}" ng-model="fromDate">    
</div>
<div class="col-sm-2">
<h6>To Date</h6>
<input type="date" onkeydown="return false" id="toDate" class="form-control" ng-change="tdateSel()" min="{{tmindate}}" max="{{tmaxdate}}" ng-model="toDate">
</div>

这是控制器

$scope.fromDate = new Date((new Date()).valueOf() - 1000 * 3600 * 24 * 7);
$scope.toDate = new Date();
$scope.fmaxdate = $filter('date')(new Date($scope.toDate.valueOf() - 1000 * 3600 * 24), "yyyy-MM-dd");
$scope.tmindate = $filter('date')(new Date($scope.fromDate.valueOf() + 1000 * 3600 * 24), "yyyy-MM-dd");
$scope.tmaxdate = $filter('date')(new Date(), "yyyy-MM-dd");
$scope.fdateSel = function () {
$scope.tmindate = $filter('date')(new Date($scope.fromDate.valueOf() + 1000 * 3600 * 24), "yyyy-MM-dd");
}
$scope.tdateSel = function () {
if (undefined != $scope.toDate)
$scope.fmaxdate = $filter('date')(new Date($scope.toDate.valueOf() - 1000 * 3600 * 24), "yyyy-MM-dd");
}

Answer 1

我们为模型设置值的方式很重要。

将其从以下位置更改为：

$scope.fromDate = new Date((new Date()).valueOf() - 1000 * 3600 * 24 * 7);
$scope.toDate = new Date();

自：

$scope.fromDate = (() => {
let fromDate = new Date(new Date().valueOf() - 1000 * 3600 * 24 * 7);
fromDate = new Date(
fromDate.getFullYear(),
fromDate.getMonth(),
fromDate.getDate()
);
return fromDate;
})();
$scope.toDate = (() => {
let toDate = new Date();
toDate = new Date(toDate.getFullYear(), toDate.getMonth(), toDate.getDate());
return toDate;
})();

Answer 2

我无法复制您看到的错误，但我确实注意到您在输入中缺少ng-model属性。让我知道这是否有帮助。

下面是一个工作示例：

var app = angular.module("app", []);
app.controller('exampleController', ['$scope', function($scope) {
$scope.fromDate = new Date((new Date()).valueOf() - 1000 * 3600 * 24 * 7);
$scope.toDate = new Date();
$scope.fmaxdate = new Date($scope.toDate.valueOf() - 1000 * 3600 * 24);
$scope.tmindate = new Date($scope.fromDate.valueOf() + 1000 * 3600 * 24);
$scope.tmaxdate = new Date();
$scope.fdateSel = function () {
if (undefined != $scope.fromDate) {
$scope.tmindate = new Date($scope.fromDate.valueOf() + 1000 * 3600 * 24);
}
}
$scope.tdateSel = function () {
if (undefined != $scope.toDate) {
$scope.fmaxdate = new Date($scope.toDate.valueOf() - 1000 * 3600 * 24);
}
}
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<div ng-app="app" ng-controller="exampleController as ctrl">
<div class="col-sm-2">
<h6>From Date</h6>
<input type="date" onkeydown="return false" ng-model="fromDate" id="fromDate" class="form-control" ng-change="fdateSel()" max="{{fmaxdate}}">    
</div>
<div class="col-sm-2">
<h6>To Date</h6>
<input type="date" onkeydown="return false" ng-model="toDate" id="toDate" class="form-control" ng-change="tdateSel()" min="{{tmindate}}" max="{{tmaxdate}}">
</div>
</div>