[Fixed] Can I use [formControl] without also needing [formGroup]?

Issue

I am using a dropdown in my UI, but when I come to use [formControl] I am getting the error thrown:

Cannot find control with unspecified name attribute

I am using ReactiveFormsModule in my app.module.ts.

I have Google’d and found that a solution is to use [formGroup] in the parent div, but I’m unsure of how to implement properly as I am defining my formControl from within a subscribe.

myComp.component.html

<div class="exceptional-status">
  <select #exceptionalSelect id="excep-status-dropdown" [formControl]="select">
    <option disabled value="default">--Exceptional statuses--</option>
    <!-- other options here with *ngFor -->
  </select>
</div>

myComp.component.ts

select: FormControl;

mySubscription() {
  this.myService.myFunct.subscribe(res => {
    this.select = new FormControl(res.status)
  });
}

Solution

Yes, you can use FormControlDirective without FormGroup.

Angular expects FormControl to be defined:

select = new FormControl();

mySubscription() {
  this.myService.myFunct.subscribe(res => {
    this.select.setValue(res.status)
  });
}

Leave a Reply

(*) Required, Your email will not be published