如何禁用日期选择器角度中的过去日期
H V*_*rma 1 html javascript twitter-bootstrap angularjs meteor
我有一个带日期选择器的输入字段..我需要用户只从当前日期选择日期，过去的日期不应该是可点击的..下面是代码。
<div class="col-lg-4">
<input class="form-control" type="datetime" date-time auto-close="true" view="date"
min-view="date" maxlength="10" format="dd/MM/yyyy" ng-model="$ctrl.DateInput"
placeholder="renewal date" required="true">
</div>
快速帮助表示赞赏..谢谢！
小智 5
代码：
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-animate.js"></script>
<script language="javascript" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.14.3.js"></script>
</head>
<body style="Padding:20px;">
<form>
<div ng-app="myApp" ng-controller="myCntrl">
Date:
<input type="text" uib-datepicker-popup="{{dateformat}}" min-date="mindate" ng-model="dt" is-open="showdp" />
<span>
<button type="button" class="btn btn-default" ng-click="showcalendar($event)">
<i class="glyphicon glyphicon-calendar"></i>
</button>
</span>
</div>
<script language="javascript">
angular.module('myApp', ['ngAnimate', 'ui.bootstrap']);
angular.module('myApp').controller('myCntrl', function ($scope) {
$scope.today = function () {
$scope.dt = new Date();
};
$scope.mindate = new Date();
$scope.dateformat="MM/dd/yyyy";
$scope.today();
$scope.showcalendar = function ($event) {
$scope.showdp = true;
};
$scope.showdp = false;
});
</script>
</form>
</body>
</html>工作如下：
小智 5
<input class="form-control m-input pl-6" type="date"
[min]="todayDate"formControlName="dateValidity">
min 和 max 是用于验证输入范围的日期属性，这些属性将在日历弹出窗口中禁用之前和之后的日期。
在您的 ts 中定义最小日期
todayDate=this.datePipe.transform(new Date(), 'yyyy-MM-dd');