Angular form field always fails 'required' check

Question

Background

I am using an ejs-timepicker in an Angular project. For reference, ejs-timepicker is part of the library @syncfusion/ej2-angular-calendars, and details can be found regarding it here and here. I am specifically using "@syncfusion/ej2-angular-calendars": "19.1.55"

---

Question

Whenever a time is entered into the field for the FIRST time, it fails the "Required" check and remains invalid. Printing all of the errors in the control simply outputs "required", so this is the only issue in the validation. It is also of note that the field keeps its ng-pristine class despite that no longer being true. Upon clearing the input and adding a new one, it will now be accepted. This patterns follows even when refreshing the page; meaning it will still work if it has been cleared once prior to refresh, and not work otherwise. I have read practically everything I can find online regarding this and similar issues, but cannot figure out why this is happening. I have also tried manually setting the properties with $setDirty etc, but the issue has not stopped

---

Code / Image

Html:

<div class="container-row">
  <div class="form-item" *ngIf="form.get('startTime') as control">
    <ejs-timepicker
      formControlName="startTime"
      placeholder="Start Time"
      floatLabelType="Auto"
      cssClass="e-outline"
      [class.e-error]="control.invalid"
    ></ejs-timepicker>
    <div *ngIf="control.invalid && (control.dirty || control.touched)" class="e-error">
      <div *ngFor="let err of getErrorList(control.errors)">{{err.message}}</div>
      <div *ngIf="control.errors.required">Start Time is required.</div>
    </div>
  </div>

TS formBuilder:

  form = this.formBuilder.group({
    //other fields
    startTime: [null, AppValidators.required],
    endTime: [null, AppValidators.required],
  });

Error in the view