如何使用Angular4通过元素ID设置焦点

Question

我是Angular的新手，并且试图用它来设置ID为“input1”的输入焦点。我使用下面的代码：

@ViewChild('input1') inputEl: ElementRef; 

然后在组件后：

this.inputEl.nativeElement.focus(); 

但它无法正常工作。我究竟做错了什么？任何帮助都感激不尽。

Answer 1

一个由@ Z.Bagley中提到的问题的答案给了我答案。我必须从@ angular/core将Renderer2导入到我的组件中。然后：

const element = this.renderer.selectRootElement('#input1'); 

setTimeout(() => element.focus(), 0); 

谢谢@MrBlaise的解决方案！

Answer 2

组件

import { Component, ElementRef, ViewChild, AfterViewInit} from '@angular/core'; 
... 

@ViewChild('input1') inputEl:ElementRef; 

ngAfterViewInit() { 
     this.inputEl.nativeElement.focus(); 
} 

HTML

<input type="text" #input1>