[Solved] Which of the following correctly defines a synchronous custom validator function in Angular that checks if a control's value is a non-empty string? | Angular

Angular - Reactive Forms

Which of the following correctly defines a synchronous custom validator function in Angular that checks if a control's value is a non-empty string?

Afunction nonEmptyValidator(control: AbstractControl): ValidationErrors | null { return control.value ? null : { empty: true }; }

Bfunction nonEmptyValidator(control: AbstractControl): boolean { return control.value !== ''; }

Cfunction nonEmptyValidator(control: AbstractControl): void { if (!control.value) { return { empty: true }; } }

Dfunction nonEmptyValidator(control: AbstractControl): string | null { return control.value ? null : 'empty'; }

Step-by-Step Solution

Solution:

Step 1: Understand the validator signature
A synchronous custom validator must return either null if valid or an object of type ValidationErrors if invalid.
Step 2: Analyze each option
function nonEmptyValidator(control: AbstractControl): ValidationErrors | null { return control.value ? null : { empty: true }; } returns null or an error object correctly.
function nonEmptyValidator(control: AbstractControl): boolean { return control.value !== ''; } returns a boolean, which is invalid.
function nonEmptyValidator(control: AbstractControl): void { if (!control.value) { return { empty: true }; } } returns void and does not return the error object properly.
function nonEmptyValidator(control: AbstractControl): string | null { return control.value ? null : 'empty'; } returns a string or null, which is not the expected return type.
Final Answer:
Option A -> Option A
Quick Check:
Validator returns null or error object [OK]

Quick Trick: Validator returns null or error object [OK]

Common Mistakes:

MISTAKES

Master "Reactive Forms" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

Which of the following correctly defines a synchronous custom validator function in Angular that checks if a control's value is a non-empty string?