[Solved] Consider this Angular template:<div [attr.aria-hidden]="isVisible ? 'false' : 'true'">Content</div>If isVisible is false, what is the value of aria-hidden in the rendered HTML? | Angular

Angular - Internationalization and Accessibility

Consider this Angular template:

<div [attr.aria-hidden]="isVisible ? 'false' : 'true'">Content</div>

If isVisible is false, what is the value of aria-hidden in the rendered HTML?

Aaria-hidden attribute is removed

Baria-hidden="false"

Caria-hidden="true"

Daria-hidden="undefined"

Step-by-Step Solution

Solution:

Step 1: Analyze the ternary expression in binding
The expression sets aria-hidden to 'false' if isVisible is true, else 'true'.
Step 2: Substitute isVisible = false
When isVisible is false, the expression evaluates to 'true'.
Final Answer:
aria-hidden="true" -> Option C
Quick Check:
Conditional ARIA binding reflects correct string value [OK]

Quick Trick: Use ternary to toggle ARIA attribute string values [OK]

Common Mistakes:

Master "Internationalization and Accessibility" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

Consider this Angular template: