Catch change on Timepicker

I present you an example how to use ngModel with timepicker. Regarding TimeChange event: it looks like we are not handling every time change event correctly. Could you precise on what actions did you expect the timeChange event to fire?

template:

<section class="border p-4 d-flex gap-5 justify-content-center mb-4">
  <mdb-form-control>
    <input
      mdbInput
      type="text"
      id="form1"
      class="form-control"
      [mdbTimepicker]="timepicker"
      [(ngModel)]="timeValue"
      required
    />
    <label mdbLabel class="form-label" for="form1">Example label</label>
    <mdb-timepicker-toggle [mdbTimepickerToggle]="timepicker"></mdb-timepicker-toggle>
    <mdb-timepicker #timepicker (timeChange)="onTimeChange($event)"></mdb-timepicker>
  </mdb-form-control>
  <button class="btn btn-sm" (click)="setTimeValue('02:02 AM')">02:02 AM</button>
  <button class="btn btn-sm" (click)="setTimeValue('07:42 AM')">07:42 AM</button>
</section>etTimeValue('07:42 AM')">07:42 AM</button>

Component's class:

export class TimePickerComponent {
  timeValue: string;

  setTimeValue(time: string) {
    this.timeValue = time;
  }