Angular - Component Interaction
How do you define a named slot in Angular that projects elements with the CSS class
footer?How do you define a named slot in Angular that projects elements with the CSS class footer?
easy📝 Syntax Q3 of 15
Step-by-Step Solution
Solution:
Step 1: Understand CSS selector syntax in ng-content
Theselectattribute uses CSS selectors to match elements for projection.Step 2: Identify correct selector for class
Classes are selected with a dot prefix, so.footeris correct.Step 3: Eliminate incorrect selectors
#footer selects by id, footer selects by tag name, and [footer] selects by attribute.Final Answer:
<ng-content select=".footer"></ng-content> -> Option AQuick Check:
Class selector = dot prefix [OK]
Quick Trick: Use .class selector in select attribute for named slots [OK]
Common Mistakes:
- Using id selector (#footer) instead of class selector
- Using tag name selector instead of class
- Confusing attribute selector syntax
Master "Component Interaction" in Angular
Want More Practice?
15+ quiz questions · All difficulty levels · Free
Free Signup - Practice All QuestionsMore Angular Quizzes