Datepicker

Basic

Choose a date MM/DD/YYYY

Custom Selection

Enter a date range MM/DD/YYYY – MM/DD/YYYY

Forms integration

Enter a date range MM/DD/YYYY – MM/DD/YYYY @if(range.controls.start.hasError('matStartDateInvalid')) { Invalid start date } @if(range.controls.end.hasError('matEndDateInvalid')) { Invalid end date }

Selected range: {{ range.value | json }}

Action buttons

Choose a date MM/DD/YYYY Enter a date range MM/DD/YYYY – MM/DD/YYYY

Date range picker

First campaign MM/DD/YYYY – MM/DD/YYYY Second campaign MM/DD/YYYY – MM/DD/YYYY

Open Method

Choose a date MM/DD/YYYY

Custom Icon

Choose a date MM/DD/YYYY keyboard_arrow_down

Custom Date Classes

Choose a date MM/DD/YYYY

Pallete Colors

Inherited calendar color MM/DD/YYYY Custom calendar color MM/DD/YYYY

Change Events

Input & change events MM/DD/YYYY

Logs:

@for(e of events; track e) {
{{ e }}
}

Disabled

Completely disabled MM/DD/YYYY

Popup disabled MM/DD/YYYY

Input disabled MM/DD/YYYY

Inline

Selected date: {{ selected }}

Start Date

Choose a date MM/DD/YYYY

Touch Ui

Choose a date MM/DD/YYYY