[Solved] What is wrong with this code snippet inside a component?@ContentChild('proj') projElem: ElementRef;ngOnInit() { console.log(this.projElem.nativeElement); } | Angular

Angular - Component Interaction

What is wrong with this code snippet inside a component?

@ContentChild('proj') projElem: ElementRef;
ngOnInit() { console.log(this.projElem.nativeElement); }

AMissing @ViewChild decorator instead of @ContentChild

BAccessing @ContentChild in ngOnInit may cause undefined error

CprojElem should be a TemplateRef, not ElementRef

DThe selector string 'proj' should be a type, not string

Step-by-Step Solution

Solution:

Step 1: Timing of @ContentChild availability
@ContentChild references are not set before ngAfterContentInit.
Step 2: Accessing in ngOnInit causes error
Accessing projElem.nativeElement in ngOnInit risks undefined because content is not initialized yet.
Final Answer:
Accessing @ContentChild in ngOnInit may cause undefined error -> Option B
Quick Check:
Access @ContentChild after ngAfterContentInit [OK]

Quick Trick: Never access @ContentChild before ngAfterContentInit [OK]

Common Mistakes:

Master "Component Interaction" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

What is wrong with this code snippet inside a component?