Angular 애플리케이션에서 사용자 입력 폼을 초기화할 때, 폼 필드에 기본값을 설정하는 방법을 알아봅시다.

Template-Driven Forms

템플릿 기반 폼에서는 폼 필드의 기본값을 ngModel 디렉티브를 사용하여 설정할 수 있습니다.

<input type="text" [(ngModel)]="name" name="name" />

컴포넌트 클래스에서 기본값을 설정하려면 해당 필드를 초기화합니다.

name: string = 'John Doe';

Reactive Forms

리액티브 폼에서는 FormControl을 사용하여 폼 필드의 기본값을 설정할 수 있습니다.

this.myForm = new FormGroup({
  name: new FormControl('John Doe')
});

또는 patchValue() 메서드를 사용하여 폼 초기화 시 기본값을 설정할 수 있습니다.

this.myForm.patchValue({
  name: 'John Doe'
});

위의 예제를 참고하여 Angular 애플리케이션에서 사용자 입력 폼의 기본값을 설정하는 방법을 익혀보세요.

참고 자료

• Angular 공식 문서: Reactive Forms
• Angular 공식 문서: Template-driven Forms

이제 Angular 애플리케이션에서 폼의 초기값을 설정하는 방법에 대해 더 잘 이해했을 것입니다.