Forms

Angular offers reactive forms (`FormBuilder`, `FormControl`, `FormGroup`) with explicit model in TypeScript, and template-driven forms with `ngModel` for simple cases.

Reactive forms excel at dynamic fields, validators, and unit testing without DOM.

					form = this.fb.group({
  email: ['', [Validators.required, Validators.email]],
});
				

Custom `ControlValueAccessor` integrates third-party inputs. Typed forms (Angular 14+) narrow value types.

On interviews: when reactive beats template-driven, sync versus async validators, and displaying `invalid + touched` UX.

Common pitfalls: mutating form values without `patchValue`, validation logic duplicated in component and template, and not disabling submit while pending async validator.

The trade-off is explicit reactive models and testability versus more boilerplate than template-driven forms.

Checklist:

• Reactive for complex or dynamic forms.
• Centralize validators.
• Show errors on touched/dirty rules.
• CVA for custom inputs.