Question

我想将Angular UI Datepicker限制在作为变量传入的两个日期之间。以下是此问题的工作人员：http://plnkr.co/edit/zsjpoVZtHqJLIP2RW6vm?p=preview

这里是变量：

mycurrentdate = '2016-04-15'
mymindate = '2016-04-01'
mymaxmonth = '2016-05-01'

我的实际最大日期将是mymaxmonth的结束，所以在这种情况下：'2016-05-31'

$scope.maxDate = new Date(
                    $scope.mymaxmonth + (TO THE END OF THE MONTH)
                );

需要注意的一点是，通过new Date()运行它会返回给定日期前一天的日期。例如：

$scope.minDate = new Date(
                    $scope.mymindate
                );

其中$ scope.minDate返回Wed Mar 30 2016 17:00:00 GMT-0700 (PDT)我查找了为什么它返回3月30日而非4月1日的原因，这似乎是时区错误？

我想设置一个mymindate'2016-04-01'并获取mymaxdate ='2016-05-31'并禁用此范围之外的所有日期。我特别想知道如何到月底。在javascript中是否有一些endofmonth（）函数？

在控制器中我有：

$scope.mymindate = '2016-04-01';
$scope.mymaxmonth = '2016-05-01'; //want mymaxdate to be '2016-05-31'

$scope.minDate = new Date(
  $scope.mymindate
  );
$scope.maxDate = new Date(
  $scope.mymaxmonth + 1
  );

在模板中我有：

<p class="input-group">
          <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="popup1.opened" min="minDate" max="maxDate" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
          <span class="input-group-btn">
            <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button>
          </span>
        </p>

Answer 1

Plunkr中的示例将无法按照它们的编写方式运行。

我建议你从一些reading开始，了解如何使用vanilla Javascript正确操作Javascript日期。

一旦你知道你想要操作的内容和方式（在这种情况下是一个月），我会建议一个可以轻松为你做的文件库，例如MomentJS。

时刻将允许您采取任何日期并允许您以任何方式操纵它，包括添加，月末和本地（时区修复）。

在moment()中换行任何日期，并可以参考MomentJS文档来执行您想要的操作。您仍然需要将日期包装在new Date()中，以便它可以在Angular UI Datepicker中使用。

new Date(moment($scope.mymaxmonth).add(1,'months')); //Fri Jun 1 2016 16:41:02 GMT-0700 (Pacific Daylight Time)
new Date(moment($scope.mymaxmonth).endOf('month')); // Tue May 31 2016 23:59:59 GMT-0700 (Pacific Daylight Time)
new Date(moment($scope.mymindate).local()); //Fri Apr 01 2016 00:00:00 GMT-0700 (Pacific Daylight Time)

Here和here有几种方法可以将时刻整合到您的Angular应用中。

AngularUI Datepicker将变量传递给minDate和maxDate

1 个答案: