San

San

  • 1.4k
  • 750
  • 267.3k

ngModel cannot be used to register form controls with a pare

Dec 13 2019 6:34 AM
After Add  below code for dropdown validation
<form #GroupForm1="ngForm" [formGroup]="filtersForm" (ngSubmit)="onSubmit(GroupForm1)" > 
 
<th>
<select formControlName="Dropdown" style="width:100%;height:30px" (change)="selectedGroupID($event.target.value)" >
<option [value]="null">--Select--</option>
<option [value]="prot.GroupID" *ngFor="let prot of ProductGroupdataAll" >
{{prot.Group}}
</option>
</select>
<span *ngIf="hasDropDownError">Enter Country ...</span>
</th>
 
 getting below error.
 
 
ERROR Error: "
ngModel cannot be used to register form controls with a parent formGroup directive. Try using
formGroup's partner directive "formControlName" instead. Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
</div>
In your class:
this.myGroup = new FormGroup({
firstName: new FormControl()
});
Or, if you'd like to avoid registering this form control, indicate that it's standalone in ngModelOptions:
Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
<input [(ngModel)]="showMoreControls" [ngModelOptions]="{standalone: true}">
</div>
"
Angular 9
View_groupComponent_2 groupComponent.html:82
Angular 32
RxJS 5
Angular 11
groupComponent.html:74:37
ERROR CONTEXT
Object { view: {…}, nodeIndex: 49, nodeDef: {…}, elDef: {…}, elView: {…} }
groupComponent.html:74:37
ERROR Error: "
ngModel cannot be used to register form controls with a parent formGroup directive. Try using
formGroup's partner directive "formControlName" instead. Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
</div>
In your class:
this.myGroup = new FormGroup({
firstName: new FormControl()
});
Or, if you'd like to avoid registering this form control, indicate that it's standalone in ngModelOptions:
Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
<input [(ngModel)]="showMoreControls" [ngModelOptions]="{standalone: true}">
</div>
"

Answers (1)