Сброс реактивной формы FormControl / AbstractControl внутри пользовательского элемента управления с CustomValueAccessor

Question

У меня есть компонент, реализующий CustomValueAccessor, в котором есть метод clear() для сброса значения данного formControlName. Под капотом есть <input type="file">. Установка его в качестве @ViewChild и установка значения собственного элемента не отражаются в FormGroup. Также не работает запуск обратного вызова из registerOnChange(fn: Function) {} с нулем.

Сейчас я просто передаю formGroup.controls.get('myControl') как @Input() компоненту пользовательского управления, сбрасывая его там. Но есть ли лучший способ получить контроль внутри пользовательского компонента управления? Я также использовал EventEmitter, чтобы сделать это вне компонента, но хочу, чтобы эта логика c была записана один раз в компоненте.

Answer 1

Вы можете создать FromControl внутри своего компонента и работать с ним также реактивно.

ts файл:

control = new FormControl();

html файл:

<input type="file" [formControl]="control">

Затем, если вы хотите сбросить его, вы просто вызываете this.control.reset() и propagateChange() с обновленным значением (вероятно, в вашем случае это не определено)