What I'm Doing
I have a component that hides/shows using *ngIf
based on a simple Boolean. When the component becomes visible I want to apply focus to a child element within its template.
The Problem
If I flip the Boolean value the component shows correctly but if I then try and get a reference to the child element using this._elRef.nativeElement.querySelector("div#test")
it just comes back null
. If I wait a few seconds the same code will return the reference to the element as I expected.
Speculation
I'm assuming that after flipping the Boolean angular goes through a whole rendering cycle to reveal the newly visible component and that this has not finished by the time I apply the querySelector()
in the next line.
What I'd Like To Know
So what I'm wondering is, how can I be sure that my ngIf
has taken effect and the elements are their in the DOM to be selected?
Is there such a thing as a callback for ngIf
or can I force the view to update and get a callback from that?
I hope this makes sense. It has been a long day (long week) and I'm super tired.
Thanks all
If it helps, I'm using Angular2 v2.0.0-beta.15
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…