How do you correctly use @ContentChild to get a reference to a projected element with the template reference variable contentRef?

easy📝 Syntax Q3 of 15

Angular - Component Interaction

How do you correctly use @ContentChild to get a reference to a projected element with the template reference variable contentRef?

A@ContentChild(contentRef) contentElement!: ElementRef;

B@ContentChild('contentRef') contentElement!: ElementRef;

C@ContentChild(#contentRef) contentElement!: ElementRef;

D@ContentChild('contentRef', {static: false}) contentElement: string;

Step-by-Step Solution

Solution:

Step 1: Syntax of @ContentChild
The decorator takes a string selector matching the template reference variable name as a string.
Step 2: Correct usage
Use @ContentChild('contentRef') with quotes around the variable name and declare the property type, usually ElementRef or a directive.
Final Answer:
@ContentChild('contentRef') contentElement!: ElementRef; -> Option B
Quick Check:
Template refs are passed as strings without # in @ContentChild. [OK]

Quick Trick: Use string name without # in @ContentChild selector [OK]

Common Mistakes:

Master "Component Interaction" 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