tpls bootstrap angularjs datepicker angular-ui-bootstrap

angularjs - bootstrap - Desactivar fechas pasadas en datepicker-popup



ui bootstrap angular 5 (3)

Copiado de la documentación real

<h4>Inline</h4> <div style="display:inline-block; min-height:290px;"> <uib-datepicker ng-model="dt" min-date="minDate" show-weeks="true" class="well well-sm" custom-class="getDayClass(date, mode)"></uib-datepicker> </div>

Por favor lea el doc api

Aquí está el enlace de Plnkr

http://plnkr.co/edit/?p=preview

min-date = "mindDate" resolverá su consulta en breve.

Tengo el siguiente fragmento de código en el que el control datepicker está ahí.

<input type="text" name="startDate" class="form-control input-sm" datepicker-popup="dd-MMMM-yyyy" ng-model="startDate" required />

Aquí, tengo que deshabilitar las fechas anteriores en el control datepicker y a continuación es lo que he configurado, pero no está funcionando. ¿Me estoy perdiendo de algo?

App.config([''datepickerConfig'', ''datepickerPopupConfig'', function (datepickerConfig, datepickerPopupConfig) { datepickerConfig.startingDay = 1; datepickerConfig.showWeeks = true; datepickerPopupConfig.datepickerPopup = "dd-MMMM-yyyy"; datepickerPopupConfig.currentText = "Now"; datepickerPopupConfig.clearText = "Erase"; datepickerPopupConfig.closeText = "Close"; }]);


Si desea limitar el rango de fechas posibles, agregue fecha min-date o min-date max-date como en el ejemplo .

Aquí está la parte relevante de la documentación :

  • max-date (Valor predeterminado: nulo): define la fecha máxima disponible.
  • fecha mínima (Valor predeterminado: nulo): define la fecha mínima disponible.

Desde angular ui-bootstrap versión 1.1.0 necesita usar un atributo llamado datepicker-options para configurar un datepicker:

<input type="text" class="form-control" datepicker-options="dateOptions" datepicker-popup="dd-MMMM-yyyy" is-open="popup.opened"/> <span class="input-group-btn"> <button type="button" class="btn btn-default" ng-click="open()"> <i class="glyphicon glyphicon-calendar"></i> </button> </span>

Ahora solo necesita establecer la propiedad minDate a la fecha actual o cualquier otra fecha que desee para ser la Fecha mínima del selector de fecha. En lugar de escribir la configuración datepicker en el bloque .config de su aplicación, debe escribirla en un controlador o servicio:

$scope.dateOptions = { minDate: new Date() }; $scope.popup = { opened: false }; $scope.open = function() { $scope.popup.opened = true; };

Para obtener más información, lea la documentación oficial .