Search code examples
angulardatepickerangular7bootstrap-datetimepicker

Select Past dates using dl-date-time-picker in Angular


I have a datetimepicker component in a form. I'm using Angular 7 and haave used the dl-date-time-picker component.

I need to disable previous dates in the date and time component. I tried using the [selectFilter] attribute that can be bound to it. But the current date, month and year is also disabled. Is there a way to use the filter such that it does not happen

I am using something like:

<dl-date-time-picker [selectFilter]="startDatePickerFilter" startView="day" maxView="year" minView="minute" minuteStep="30" [(ngModel)]="sDate"
                name="sdate">
</dl-date-time-picker>

The filter is defined as

private startDatePickerFilter(dateButton: DateButton, viewName: string): boolean {
        return !(dateButton.value < (new Date().getTime()));
    }

I am using the method defined in Disable future dates using angular-bootstrap-datetimepicker


Solution

  • Try with the below code.

    import {DateButton} from 'angular-bootstrap-datetimepicker';
    import * as _moment from 'moment';
    import {unitOfTime} from 'moment';
    
    private startDatePickerFilter(dateButton: DateButton, viewName: string): boolean {
       return dateButton.value >= moment().startOf(viewName as unitOfTime.StartOf).valueOf();
    }
    

    Reference : https://stackblitz.com/github/dalelotts/angular-bootstrap-datetimepicker-demo