Search code examples
angularangular-forms

How to use Angular4 to set focus by element id


I am new to Angular, and am trying to use it to set focus on an input with the id "input1". I am using the following code:

@ViewChild('input1') inputEl: ElementRef;

then later in the component:

 this.inputEl.nativeElement.focus();

But it isn't working. What am I doing wrong? Any help will be much appreciated.


Solution

  • One of the answers in the question referred to by @Z.Bagley gave me the answer. I had to import Renderer2 from @angular/core into my component. Then:

    const element = this.renderer.selectRootElement('#input1');
    setTimeout(() => element.focus(), 0);
    

    Thank you @MrBlaise for the solution!