第一次約會的第二

Question

中的minDate我有這兩個datepickers：

<div class="form-group" ng-controller="datepickerpopupCtrl"> 

      <label>Start date:</label> 
      <p class="input-group"> 
       <input ng-model="task.startdate" name="startdate" type="text" class="form-control" 
         uib-datepicker-popup="{{format}}" 
         datepicker-options="options" 
         is-open="opened" 
         ng-required="true" 
         close-text="Close" 
         alt-input-formats="altInputFormats" 
         show-button-bar="false" 
         placeholder="startdate" /> 
       <span class="input-group-btn"> 
         <button type="button" class="btn btn-default" ng-click="open()"><i 
           class="glyphicon glyphicon-calendar"></i></button> 
        </span> 
      </p> 
     </div> 
     <div class="form-group" ng-controller="datepickerpopupCtrl"> 

      <label>End date:</label> 
      <p class="input-group"> 
       <input ng-model="task.enddate" name="enddate" type="text" class="form-control" 
         uib-datepicker-popup="{{format}}" 
         datepicker-options="optionsEndDate" 
         is-open="opened" 
         ng-required="true" 
         close-text="Close" 
         alt-input-formats="altInputFormats" 
         show-button-bar="false" 
         placeholder="Date de fin" 

       /> 
       <span class="input-group-btn"> 
         <button type="button" class="btn btn-default" ng-click="open()"><i 
           class="glyphicon glyphicon-calendar"></i></button> 
        </span> 
      </p> 
     </div> 

我想enddate（第二日期選擇器）由第一日起startdate限制。

現在我已經試過這樣：

function datepickerpopupCtrl($scope) { 

    $scope.dt = new Date(); 
    $scope.open = open; 
    $scope.opened = false; 
    $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate']; 
    $scope.format = $scope.formats[0]; 
    $scope.options = { 
     showWeeks: false, 
     minDate : new Date(), 
     startDate : new Date() 
    }; 
    $scope.optionsEndDate = { 
     showWeeks: false, 
     minDate : ($scope.task.startdate == undefined) ? new Date() : $scope.task.dateDebut, 
     startDate : new Date() 
    }; 
    function open() { 
     $scope.opened = true; 
    } 
} 

}）

，但它不工作。

任何建議將appreciated.thanks

Answer 1

你需要安裝一個$watch。它不工作的原因是因爲您在控制器初始化時爲第二個日期選擇器設置了minDate。最初，$scope.task.startdate未定義，所以minDate由於您的三元運算符而被分配爲new Date()。故事結局。

不管你是如何改變的$scope.task.startdate價值，一切都太遲了，因爲你已經設置minDate到new Date()和您所做$scope.task.startdate任何更改沒有任何效果。

因此，要處理這一點的最好辦法是初始設置minDate到new Date()，然後設置一個手錶上$scope.task.startdate：

$scope.optionsEndDate = { 
    showWeeks: false, 
    minDate : new Date(), 
    startDate : new Date() 
}; 

$scope.$watch('task.startdate', function(newValue) { 
    $scope.optionsEndDate.minDate = (newValue == undefined) ? new Date() : newValue; 
}); 

，或者任選，你可以只分配minDate是$scope.task.startdate，如果你當它未定義不在乎：

$scope.optionsEndDate = { 
    showWeeks: false, 
    minDate : $scope.task.startdate, 
    startDate : new Date() 
}; 

順便說一句，到底是什麼？$scope.dateDebut我只在你的代碼中出現過一次。這是一個錯字嗎？