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.


<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>


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'