कोणीय यूई-बूटस्ट्रैप डेटपिकर दिमाग

Question

में टाइप किए जाने पर मान्य नहीं है मेरे पास एक ui-bootstrap डेटपिकर वाला एक फॉर्म है। मैं तारीख को अतीत में होने से रोकना चाहता हूं।

मैंने नीचे दिखाए गए अनुसार new Date() पर निर्देश पर न्यूनतम तिथि सेटिंग सेट की है। यह पॉपअप का उपयोग करते समय अतीत में दिनांकों के चयन को सही ढंग से रोकता है, हालांकि मैं अभी भी अतीत में एक दिनांक टाइप कर सकता हूं और यह ठीक है।

मैं टाइप की गई तिथियों पर न्यूनतम दिनांक सत्यापन कैसे लागू कर सकता हूं?

Plunkr: https://plnkr.co/edit/EHO1BG8BspNMvsoKT30l?p=preview

एचटीएमएल:

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

जे एस:

app.controller('MainCtrl', function($scope) { 
    $scope.dt = new Date(); 
    $scope.minDate = new Date(); 
    $scope.format = "dd/MM/yyyy"; 
    $scope.altInputFormats = ['d!/M!/yyyy']; 
    $scope.dateOptions = { 
    formatYear: 'yy', 
    startingDay: 1 
    }; 

    $scope.popup1 = { 
    opened: false 
    }; 

    $scope.open1 = function() { 
    $scope.popup1.opened = true; 
    }; 
}); 

Answer 1

यह सही ढंग से काम करना चाहिए मैं अपने नियंत्रक में changeHandler समारोह जोड़ा गया है और पर यह कहा जाता है इनपुट का एनजी-परिवर्तन।

एचटीएमएल:

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

जे एस:

app.controller('MainCtrl', function($scope) { 
    $scope.dt = new Date(); 
    $scope.minDate = new Date(); 
    $scope.format = "dd/MM/yyyy"; 
    $scope.altInputFormats = ['d!/M!/yyyy']; 
    $scope.dateOptions = { 
    formatYear: 'yy', 
    startingDay: 1 
    }; 

    $scope.popup1 = { 
    opened: false 
    }; 

    $scope.changeHandler = function() { 
    $scope.dateForm.dt.$setValidity('$valid', $scope.dt.getTime() >= $scope.minDate.getTime()); 
    } 

    $scope.open1 = function() { 
    $scope.popup1.opened = true; 
    }; 

}); 

Answer 2

आप बस अपनी dateOptions में minDate शामिल करने की ज़रूरत वस्तु:

app.controller('MainCtrl', function($scope) { 
    $scope.dateOptions = { 
    formatYear: 'yy', 
    startingDay: 1, 
    minDate: new Date() 
    }; 
}); 

एचटीएमएल

बदलने के लिए कोई ज़रूरत नहीं