Date Picker
The DatePicker plugin allows the user to fetch date or time using native dialogs.
Repo: https://github.com/VitaliiBlagodir/cordova-plugin-datepicker
Installation
- Install the Cordova and Ionic Native plugins:
$ ionic cordova plugin add cordova-plugin-datepicker $ npm install --save @ionic-native/date-picker@4 - Add this plugin to your app's module
Supported platforms
- Android
- iOS
- Windows
Usage
import { DatePicker } from '@ionic-native/date-picker';
constructor(private datePicker: DatePicker) { }
...
this.datePicker.show({
date: new Date(),
mode: 'date',
androidTheme: this.datePicker.ANDROID_THEMES.THEME_HOLO_DARK
}).then(
date => console.log('Got date: ', date),
err => console.log('Error occurred while getting date: ', err)
);
Instance Members
show(options)
Shows the date and/or time picker dialog(s)
| Param | Type | Details |
|---|---|---|
| options |
DatePickerOptions
|
Options for the date picker. |
Returns: Promise<Date> Returns a promise that resolves with the picked date and/or time, or rejects with an error.
DatePickerOptions
| Param | Type | Details |
|---|---|---|
| mode |
string
|
The mode of the date picker Values: date | time | datetime |
| date |
Date | string | number
|
Selected date |
| minDate |
Date | string | number
|
Minimum date Default: empty String (optional) |
| maxDate |
Date | string | number
|
Maximum date Default: empty String (optional) |
| titleText |
string
|
Label for the dialog title. If empty, uses android default (Set date/Set time). Default: empty String (optional) |
| okText |
string
|
Label of BUTTON_POSITIVE (done button) on Android (optional) |
| cancelText |
string
|
Label of BUTTON_NEGATIVE (cancel button). If empty, uses android.R.string.cancel. (optional) |
| todayText |
string
|
Label of today button. If empty, doesn't show the option to select current date. (optional) |
| nowText |
string
|
Label of now button. If empty, doesn't show the option to select current time. (optional) |
| is24Hour |
boolean
|
Shows time dialog in 24 hours format. (optional) |
| androidTheme |
number
|
Choose the Android theme for the picker. You can use the DatePicker.ANDROID_THEMES property. Values: 1: THEME_TRADITIONAL | 2: THEME_HOLO_DARK | 3: THEME_HOLO_LIGHT | 4: THEME_DEVICE_DEFAULT_DARK | 5: THEME_DEVICE_DEFAULT_LIGHT (optional) |
| allowOldDates |
boolean
|
Shows or hide dates earlier then selected date. (optional) |
| allowFutureDates |
boolean
|
Shows or hide dates after selected date. (optional) |
| doneButtonLabel |
string
|
Label of done button. (optional) |
| doneButtonColor |
string
|
Hex color of done button. (optional) |
| cancelButtonLabel |
string
|
Label of cancel button. (optional) |
| cancelButtonColor |
string
|
Hex color of cancel button. (optional) |
| x |
number
|
X position of date picker. The position is absolute to the root view of the application. (optional) |
| y |
number
|
Y position of date picker. The position is absolute to the root view of the application. (optional) |
| minuteInterval |
number
|
Interval between options in the minute section of the date picker. (optional) |
| popoverArrowDirection |
string
|
Force the UIPopoverArrowDirection enum. The value any will revert to default UIPopoverArrowDirectionAny and let the app choose the proper direction itself. (optional) |
| locale |
string
|
Force locale for datePicker. (optional) |