Explain the query decorators.
01
01
Understand the problem
viewchildqueries
02
02
Attempt it yourself
Sketch your approach before reading the solution — that's what interviews test.
Stuck? AI Nudge Available
Get a conceptual hint to guide your logic without spoiling the final implementation.
03
03
Study the solution
The solution is waiting
Give it an honest attempt first — then compare your thinking with the full walkthrough.
04
04
Read the code
Query a child in the view
import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
@Component({
selector: 'app-root',
standalone: true,
template: '<input #box /> <button (click)="focus()">Focus</button>',
})
export class AppComponent implements AfterViewInit {
@ViewChild('box') box!: ElementRef<HTMLInputElement>;
ngAfterViewInit() {
// available now (the view has been initialized)
console.log('input found:', !!this.box);
}
focus() { this.box.nativeElement.focus(); }
}05
05
Join the discussion
Discussion (0)
Sign in to join the discussion.
No responses yet. Be the first to share what you think.