在 datetimepicker 上限制过去的日期答案

【问题标题】：restricting past dates on datetimepicker在 datetimepicker 上限制过去的日期
【发布时间】：2017-10-23 01:51:51
【问题描述】：

限制我的一些datetimepicker 没有问题，但这个是持久的，我试图在angularjs 中执行此操作，而datetimepicker 在数据表内，我将其设置为这个：

         {
            data: "next_action_date",
            name: "next_action_date",
            render: (data, type, row, meta)->
              initValue = data
              if data
                initValue = "'" + data + "'"
              if row.is_editable
                return '<div class="input-control text" data-role="datepicker"
                           ng-controller="ContactDateCtrl"
                           ng-init="init(' + row['pk'] + ', ' + initValue + ')" data-format="mmmm d, yyyy">
                          <input type="text" ng-model="contactDate" ng-change="onChange()">
                          <button class="button"><span class="mif-calendar"></span></button>
                      </div>';
              else
                return data;
          }

所以这是datatable 中的一列，我在其中放置了datetimepicker，所以在控制器中我正在做这样的事情：

(function() {
  var app;

  app = angular.module('cms.sales');

  app.controller('ContactDateCtrl', [
    '$scope', '$http', function($scope, $http) {
      var nextContactDateUpdateFailed, nextContactDateUpdateSuccess;
      $scope.contactDate = null;
      $scope.leadContactPk = null;
      $scope.init = function(leadContactPk, nextContactDate) {
        nextContactDate = new Date();
        $scope.leadContactPk = leadContactPk;
        if (nextContactDate) {
          return $scope.contactDate = nextContactDate.getFullYear() + '-' + (nextContactDate.getMonth() + 1) + '-' + nextContactDate.getDate();
        } else {
          return $scope.contactDate = "";
        }
      };
      $scope.onChange = function() {
        var data;
        data = {
          contact_date: $scope.contactDate,
          lead_pk: $scope.leadContactPk
        };
        return $http.post("/sales/update_contact_date/", data).then(nextContactDateUpdateSuccess, nextContactDateUpdateFailed);
      };
      nextContactDateUpdateSuccess = function() {
        return ClientNotifications.showNotification("Success", "Next communication date was updated", "success");
      };
      return nextContactDateUpdateFailed = function() {
        return ClientNotifications.showNotification("Alert", "Failed to update next communication date", "alert");
      };
    }
  ]);

}).call(this);

现在这并没有限制我的datetimepicker，它只是返回这个时间格式2017-5-23，我不确定还能做什么，我还能做什么，这样这个限制就会起作用，我在我的项目中使用metrouidatetimepicker，谁能帮我正确限制这个，谢谢。

【问题讨论】：

为什么不能使用angular-material datepicker？
因为我们在项目中使用了这个日期选择器-.-
您是否只想限制特定日期的过去日期？
@Mr_Perfect，看看这个JSFIDDLE的例子，这就是我想要的，它正在项目中的其他一些datepicker上工作，注意时间需要我以这种格式Jan 13, 2017 ，这就是metroui-datepicker

标签： javascript jquery angularjs datepicker

【解决方案1】：

只需添加格式

$(function(){
   $("#datepicker").datepicker({
   format: 'mmmm d, yyyy',
    minDate:new Date(Date.now()-(86400000 * n)) // just for min date and 'n' is the number of previous days to be allowed
   });
});

或者自定义输入的ng-model。

只要在 if 条件下做这样的事情

var tempDate = nextContactDate.toString().split(' ');
tempDate = tempDate[1] + " " + tempDate[2] + ", " + tempDate[3];
$scope.tempDate = tempDate;
$scope.contactDate = nextContactDate;

如果将日期更改为字符串，则可能无法在控制器中处理。因此，将其存储在临时的$scope.tempDate 中以显示在视图中并使用主变量即$scope.contactDate 来执行逻辑。

确保输入的ng-model 应该是$scope.tempDate

首选更好

【讨论】：