It's not pretty, but this workaround works for me:

html:

<form [formGroup]="TimeForm">
 <div class="md-form">
   <input
      mdbInput
      type="text"
      id="form1"
      class="form-control"
      formControlName="timeinput"
       [mdbTimePicker]="timepicker"
       readonly
   />
<label for="form1">Example label</label>
<mdb-timepicker-toggle
  [mdbTimePickerToggle]="timepicker"
  *ngIf="input.enabled"
></mdb-timepicker-toggle>
<mdb-timepicker #timepicker></mdb-timepicker>

ts:

TimeForm: FormGroup;
ngOnInit() {
this.TimeForm = new FormGroup({
  timeinput: new FormControl(null)
});

this.input.disable()
}


get input() { return this.TimeForm.get('timeinput'); }

@Aroquiassamy LA ROZE This feature is currently not available in the timepicker component. We will take a closer look and add a fix.

This message is only a warning and it should not break your app compilation.

Edit:

We made some tests and it looks like everything is working correctly. Please make sure that you added mdbInput directive to the input element. This directive allows using [disabled] input and blocking the input control using reactive forms (recommended in this case):

For example:

this.TimeForm = new FormGroup({
  timeinput: new FormControl({ value: null, disabled: true })
});