angular-material-components
angular-material-components copied to clipboard
Filter hours during a day
I want to prohibit selecting some hours during a day.
Setting [ngxMatDatetimePickerFilter]
doesn't help. It doesn't affect choosing hours
In the template
<mat-form-field>
<mat-label>Date</mat-label>
<!-- set readonly to protect from manually entered seconds and minutes-->
<input matInput [(ngModel)]="date"
[min]="data.min"
[max]="data.max"
[ngxMatDatetimePickerFilter]="filter"
name="since"
[ngxMatDatetimePicker]="picker" readonly required>
<mat-datepicker-toggle matSuffix [for]="$any(picker)"></mat-datepicker-toggle>
<ngx-mat-datetime-picker #picker
[stepHour]="1"
[disableMinute]="true"></ngx-mat-datetime-picker>
</mat-form-field>
In the component
filter = (date: Date | null): boolean => {
return !date || !this.data.filtered.some(d => d.equals(date));
}
+1 Same requirement for me.
@h2qutc Need this minHour
and maxHour
as the requirement does, I've added a pull request to incorporate this feature.
#228
Thanks.