본문 바로가기

Development/Javascript

[Angular] formGroup 관련 에러

728x90

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>


Solution:

이 에러가 참 어렵다. 에러 메시지 내용은 formGroup을 쓰려면 formControlName을 쓰든가 standalone을 쓰든가 하라는데 써도 같은 에러가 난다...ㅠㅠ 열심히 구글링한 결과, formGroup 속성이 있는 태그의 자식 중에 ngModel 속성을 사용하는 모든 태그에  formControlName이 있어야 에러가 안 난다. 그리고 추가적으로 Typescript에서 FormBuilder를 통해 Group을 생성할 때 formControlName에 있는 값들을 전부 넣어줘야 된다.













ㅇㅇㅇ

반응형