Components

Datepicker

Angular Material Datepicker enables users to select a date from a calendar interface. It supports both single date and date range selections.

Official docs API reference

Example

Below is an example of how BuilderKit restyles the Angular Material Datepicker and gives it a more modern appearance.

Basic datepicker

Touch UI

Range

–

<mat-form-field>
  <input matInput [matDatepicker]="picker" />
  <mat-datepicker-toggle matIconSuffix [for]="picker" />
  <mat-datepicker #picker />
</mat-form-field>