Form Group 생성

import { FormGroup, FormControl, Validators } from '@angular/forms';

// ...
this.myForm = new FormGroup({
  firstName: new FormControl('', Validators.required),
  lastName: new FormControl('', Validators.required),
  email: new FormControl('', [Validators.required, Validators.email]),
  // ...
});

위 코드에서 FormGroup를 사용하여 myForm을 생성하고, FormControl으로 각 필드를 추가합니다. 또한 각 필드에 대한 유효성을 설정할 수 있습니다.

Form Group 사용

Form Group을 HTML 폼과 함께 사용하려면 formGroup 디렉티브를 사용합니다.

<form [formGroup]="myForm">
  <input formControlName="firstName" />
  <input formControlName="lastName" />
  <input formControlName="email" />
  <!-- ... -->
</form>

여기서 formGroup 디렉티브는 myForm을 참조하고, formControlName 디렉티브는 myForm에 속한 각 FormControl을 참조합니다.

Form Group을 사용하면 간단한 Angular 폼을 쉽게 관리할 수 있으며, 유효성 검사 및 데이터 바인딩을 간소화할 수 있습니다.