Fill input fields through buttons in Angular - html

Question

this is my first time working with Angular and I'm trying to create a form field that can be filled through buttons or writing on it.
The problem is that when I click on the buttons to fill de field and then send click on the send button in the function onSubmit() I just get '' in this.registerForm.value.disp
And when I write directly on the field and click on the send button, this.registerForm.value.disp show me correctly what I wrote.
I don't figure out what is happening here and how to fix it.
This is my instruction.component.ts
export class InstructionComponent implements OnInit {
constructor(
private formBuilder: FormBuilder,
private instructionService: InstructionService,
private location: Location) { }
registerForm: FormGroup;
loading = false;
dispPattern = "^DISPOSITIVO[1-4]$";
ngOnInit() {
this.registerForm = this.formBuilder.group({
disp: ['',Validators.pattern(this.dispPattern)]
});
}
onSubmit() {
var dispInput = this.registerForm.value.disp
console.log(dispInput);
if (this.registerForm.invalid) {
console.log('bad');
return;
}
console.log(this.registerForm.value);
this.instruccionService.create({text: dispInput})
....
and my instruction.component.html
<form [formGroup]="registerForm" (ngSubmit)="onSubmit()" >
<div class="container-fluid h-100">
<div class="row">
<div class="col-3">
<button class="btn btn-primary btn-block"
onClick="autoFill1('DISPOSITIVO2'); return false;"
role="button">Dispositivo 2</button>
<button class="btn btn-primary btn-block"
onClick="autoFill1('DISPOSITIVO3'); return false;"
role="button">Dispositivo 3</button>
<div class="form-group">
<input type="text" formControlName="disp" name="disp" id="disp" class="form-control" placeholder="Elegir dispositivo" required>
</div>
</div>
</div>
</div>
<input class="btn btn-primary" type="submit" value="Send">
</form>
and autoFill1() is a script to fill the field
function autoFill1(v1){
document.getElementById('disp').value = v1;
}

Answer 1

change your autoFill1() function
function autoFill1(v1){
this.registerForm.get("dept").setValue(v1);
}