Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Angular time picker documentation

Dev-Team HCH priority asked 4 years ago


The documentation is very limited regarding the angular time picker

There is some more documentation in the basic time picker in the options section (see: https://mdbootstrap.com/docs/jquery/forms/time-picker/)

unfortunately I have no clue, how to use the angular-version based on:

  • min / max
  • minutestep
  • autoclose

Current example is:

<mdb-time-picker [twelvehour]="false" #timePicker [autoclose]="true" [minutestep]="15" ></mdb-time-picker>

Can you please state how to use the min / max, minutestep and autoclose functionality.

Thank you and best regards


Konrad Stępień staff answered 4 years ago


Hi @Dev-Team HCH,

Exactly as you wrote. For example

 <div class="md-form">
  <input
    mdbInput
    type="text"
    id="form1"
    class="form-control"
    [mdbTimePicker]="timepicker"
  />
  <label for="form1">Example label</label>
  <mdb-timepicker-toggle
    [mdbTimePickerToggle]="timepicker"
  ></mdb-timepicker-toggle>
  <mdb-timepicker #timepicker 
    [twelvehour]="false" 
    [min]="'13:00'" <!--- If twelvehour === false please add "AM" or "PM" --->
    [max]="'21:00'" <!--- "09:00PM" --->
    [autoclose]="true"
    [minutestep]="15"
  ></mdb-timepicker>
</div>

Every information about these properties you can find here.

But we'll add more examples for documentation.

Best, Konrad.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 9.3.0
  • Device: PC
  • Browser: Edge Chromium
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes