AngularUI Datepicker Aralık dışı tarih aralığını devre dışı bırakma

Question

Açısal UI Veri Tabanı'nı değişken olarak geçirilen iki tarih arasında sınırlamak istiyorum. Tercihen, momentumlar gibi bir kütüphane eklemeden çalışmayı sağlamak istiyorum, çünkü bu tarihlerle çalışmam gereken tek alan. Burada http://plnkr.co/edit/zsjpoVZtHqJLIP2RW6vm?p=preview

değişkenler şunlardır:: İşte

bu sorunun bir plunker olan

mycurrentdate = '2016-04-18' 
mymindate = '2016-04-01' 
mymaxmonth = '2016-05-01' 
mymaxdate will be calculated from mymaxmonth to be 
mymaxdate = '2016-05-31' 

Benim asıl maksimum tarih mymaxmonth son günü olacak

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

Dikkat edilmesi gereken tek şey, new Date(), belirtilen tarihten önceki bir tarihi döndürür. Örneğin:

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

$ scope.minDate Wed Mar 30 2016 17:00:00 GMT-0700 (PDT) döndürür Ben 30 Mart yerine 1 Nisan döner ve bir zaman dilimi hata gibi görünüyor neden nedenini baktı?

'2016-04-01' bir mymindate ayarlamak ve mymaxdate = '2016-05-31' değerini almak ve bu aralığın dışındaki tüm tarihleri ​​devre dışı bırakmak istiyorum. Beginners Guide to Javascript Date and Time'u okudum ve burada denedim. Ben şablonunda

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

$scope.minDate = new Date($scope.dt.getFullYear(), $scope.dt.getMonth(), 1); 

$scope.maxDate = new Date($scope.dt.getFullYear(), $scope.dt.getMonth() + 1, 0); 

: denetleyici olarak

Ben

<p class="input-group"> 
     <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="popup1.opened" min-date="minDate" max-date="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

size :) yardımcı olacaktır tarih manipülasyonları, anladım.Benim denetleyicisi olarak http://plnkr.co/edit/6U4YdTIyFXjOqRJm2qTq?p=preview

Ben: Ben min-tarih veya MAX ihtiyacı kadar sona ermedi

datepicker-options="dateOptions" 

: Benim şablonunda

var mindate = new Date($scope.mymindate); 
$scope.minDate = new Date(mindate.getTime()+(1*24*60*60*1000)); //Due to poor design by the authors of ECMA-262 the date is parsed to be a day behind, so we must add a day 

var maxdate = new Date($scope.mymaxmonth); 
$scope.maxDate = new Date(maxdate.getFullYear(), maxdate.getMonth() + 2, 0); //Add a month to get to the end of the month. 

$scope.dateOptions = { 
    maxDate: $scope.maxDate, 
    minDate: $scope.minDate, 
}; 

İşte çalışma plunker olduğunu çünkü tarihler her ikisini de kapsar. Ben dürüst olacağım, neden sadece bir tane yerine macdate.getMonth() 'a iki tane eklemeniz gerektiğinden emin değilsiniz, ama işe yaradı.

Answer 2

size input devre dışı bırakmak için tarih için uygun option ile datepicker-options ayarlamanız gerekir. Örneğinizde datepicker-options="dateOptions" kullanıldı ancak kontrol cihazınızda dateOptions bildirilmedi.

dateOptions'u maxDate ve minDate için ayarlamalısınız. gibi

$scope.dateOptions = { 
    maxDate: new Date($scope.maxDate), 
    minDate: new Date($scope.mymindate) 
}; 

ve maxDate kurmak ve minDate gibi:

$scope.mymindate = new Date('2016-04-01'); 
$scope.mymaxmonth = new Date('2016-05-01'); //wanted mymaxdate to be '2016-05-31' 

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

$scope.maxDate = new Date($scope.mymaxmonth.getFullYear(),$scope.mymaxmonth.getMonth()+1,0); 

ve HTML:

<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> 

Plunker Demo görebiliyor ve umarım bazı can sıkıcı sonra