Angular Bootstrap time picker MDB Pro component
Create
<time-picker> tag with the special code inside, like it's shown below, to use 12 or 24 hours time
picker.
Examples
<mdb-time-picker [buttonLabel]="'Done'" [twelvehour]="true" [darktheme]="false" [placeholder]="'Selected time'" [label]="'Light
version, 12hours'" [showClock]="true" [ngModel]="lightClock"></mdb-time-picker>
<mdb-time-picker [buttonLabel]="'Done'" [twelvehour]="false" [darktheme]="true"
[placeholder]="'Selected time'" [label]="'Dark version, 24hours'" [ngModel]="darkClock"></mdb-time-picker>
Options
You can declare the following options for your time-picker.
| Option | Description |
|---|---|
| twelvehour: Boolean | Pick 12 or 24 hours clock. |
| darktheme: Boolean | Choose some placeholder for your input. |
| label: String | Choose some label for your input. |
| placeholder: String | Choose some placeholder for your input. |
| showClock: Boolean | Open/hide your clock. |
| buttonLabel: String | Place your's custom text that will be used as label for 'Done' button. |
API Reference:
In order to speed up your application, you can choose to import only the modules you actually need, instead of importing the entire MDB Angular library. Remember that importing the entire library, and immediately afterwards a specific module, is bad practice, and can cause application errors.
API Reference for MDB Angular Time Picker:
// For MDB Angular Pro
import { TimepickerModule, WavesModule } from 'ng-uikit-pro-standard'