【问题标题】:Angular ui.bootstrap datepicker dynamic min-date not workingAngular ui.bootstrap datepicker 动态最小日期不起作用
【发布时间】:2019-10-29 06:04:48
【问题描述】:

我使用 Angular ui.bootstrap datepicker 我需要根据我选择的其他日期动态设置最小日期。 贝娄我添加了我尝试过的代码。我将首先选择“到”日期。根据选择的“到”日期,我需要为“从”日期设置最小日期。 'From' date min 应该是 'To' Date 中选择的日期之前的 30 天。

JS.

$scope.showButtonBar = false;
$scope.disabled = true;
$scope.today = function() {
  $scope.dt;
};
$scope.dtmax = new Date();
$scope.dateformat = "dd/MM/yyyy";
$scope.today();
$scope.showto = function($event) {
  $scope.showdpto = true;
};
$scope.showfrom = function($event) {
  $scope.showdpfrom = true;
};

$scope.setFrom = function(){
  $scope.disabled = false;
  $scope.dfmax = $scope.dt;
  $scope.dfMin = $scope.dt-30; // this is not working
  //$scope.dfMin = ($scope.dt.getDate() - 30); //this is also not working

  $scope.df = "";
  $scope.$apply();
}
$scope.Search = function(){
    console.log($scope.dt);
    console.log($scope.df);
    console.log($scope.dfMax);
  }

HTML

  From:
  <input type="text" uib-datepicker-popup="{{dateformat}}" showWeeks="false"
         show-button-bar="false" ng-model="df" is-open="showdpfrom"
         max-date="dfmax" min-date="dfMin"
         ng-style="disabled ? {'background-color':'#000'}:{'background-color':'fff'}"/>
  <span>
    <button type="button" ng-disabled="disabled" class="btn btn-default"
            ng-click="showfrom($event)">
        <i class="glyphicon glyphicon-calendar"></i>
    </button>
  </span>
  TO:
  <input type="text" uib-datepicker-popup="{{dateformat}}" showWeeks="false"
         show-button-bar="false" 
         ng-model="dt" is-open="showdpto" max-date="dtmax"
         ng-change="setFrom()"/>
  <span>
<button type="button" class="btn btn-default" ng-click="showto($event)">
       <i class="glyphicon glyphicon-calendar"></i>
</button>
<button class="btn-confirm" ng-click="Search()">SEARCH</button>
</span>

【问题讨论】:

    标签: javascript angularjs angular-ui-bootstrap


    【解决方案1】:

    min-date 属性接受值作为日期对象,因此您需要设置 dfMin 的值如下。

       $scope.dfMin = new Date($scope.dt);
       $scope.dfMin.setDate($scope.dt.getDate()-30);
    

    $scope.dfMax 有效,因为 $scope.dt 已经是一个日期对象。

    【讨论】:

    • 不需要 30 天,只需 2 天。为什么会这样?
    • 我已经更新了答案,请尝试告诉我。
    • 它仅适用于当年。如果我检查前几年,我无法在“从”日期中选择日期
    • 我已经更新了答案,而不是设置新的日期,只是设置为 mindate 的日期 - $scope.dfMin = new Date($scope.dt);
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-29
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多