time-picker value is not updated inside Reactive Form Control about amazing-time-picker HOT 6 CLOSED

<label for="time_picker" class="control-label">Time Picker</label>
<input id="time_picker" formControlName="time_picker" type="time" atp-time-picker>

@Component({
  selector: 'form-time-picker',
  styleUrls: ['./form-time-picker.component.scss'],
  template: `
    <ng-container [formGroup]="formGroup">
     <label for="time_picker" class="control-label">Time Picker</label>
     <div class="input-group mb-2" id="time_picker" (click)="open()">
        <input id="time_picker"
               formControlName="time_picker"
               type="time"
               value="{{selectedTime}}"/>
        <div class="input-group-append">
          <button type="button" class="btn btn-primary btn-icon input-group-text">
            <i class="ion-ios-time-outline"></i>
          </button>
        </div>
      </div>
    </ng-container>
  `,
})
export class FormTimePickerComponent {
  @Input()
  formGroup: FormGroup;

  @Input()
  config: TimePickerConfig;

  selectedTime: string;

  constructor(private atp: AmazingTimePickerService) {
  }

  open() {
    const timePicker = this.atp.open(this.config.pickerConfig);

    timePicker.afterClose().subscribe(time => {
      this.selectedTime = time;
      this.formGroup.controls[this.config.name].setValue(time);
    });
  }

}