Which of the following correctly defines a transition from state 'inactive' to 'active' in Angular animations?

easy📝 Conceptual Q2 of 15

Angular - Animations

Atransition('active => active', animate('500ms ease-in'))

Btransition('active => inactive', animate('500ms ease-in'))

Ctransition('inactive <=> active', animate('500ms ease-in'))

Dtransition('inactive => active', animate('500ms ease-in'))

Step-by-Step Solution

Solution:

Step 1: Identify direction of transition
The question asks for transition from 'inactive' to 'active'.
Step 2: Match syntax
Correct syntax is transition('inactive => active', ...).
Step 3: Verify options
transition('inactive => active', animate('500ms ease-in')) matches the required direction and syntax.
Final Answer:
transition('inactive => active', animate('500ms ease-in')) -> Option D
Quick Check:
Arrow direction matches state change [OK]

Quick Trick: Use 'state1 => state2' for one-way transitions [OK]

Common Mistakes:

Master "Animations" in Angular

9 interactive learning modes - each teaches the same concept differently

Want More Practice?

15+ quiz questions · All difficulty levels · Free

More Angular Quizzes