Angular Web Framework Reactive Forms & Validation

Question 1

What is the difference between template-driven and reactive forms in Angular?

Accepted Answer

Template-driven uses directives in HTML; reactive uses explicit form model in TypeScript

Answer

Template-driven forms use ngModel directives in the template for two-way binding, while reactive forms create an explicit form model in the component class, offering more control and testability.

Question 2

What is a FormGroup in reactive forms?

Accepted Answer

A collection of FormControls that tracks their combined value and validation status

Answer

FormGroup aggregates multiple FormControls into a single object, tracking the collective value and validation status, making it easy to manage forms with multiple fields.

Question 3

How do you create a custom validator in Angular?

Accepted Answer

By writing a function that returns null for valid or an error object for invalid input

Answer

Custom validators are functions that receive a FormControl and return null (valid) or an object describing the validation error (invalid), enabling application-specific validation logic.

Question 4

What is the purpose of the Validators class?

Accepted Answer

Provides built-in validation functions like required, minLength, maxLength, and pattern

Answer

The Validators class provides commonly needed validation functions that can be applied to form controls, including required, min, max, minLength, maxLength, email, and pattern.

Question 5

What is async validation in Angular forms?

Accepted Answer

Validation that performs asynchronous operations like server-side checks before determining validity

Answer

Async validators perform operations like checking if a username already exists on the server, returning an Observable or Promise that resolves to null (valid) or an error object (invalid).

Angular Web Framework Practice Test

Angular Web Framework Practice Test

Angular Web Framework Reactive Forms & Validation