更新（使用渲染器）：

请注意，原始的Renderer服务现已被Renderer2替代。

有关详细信息，请参阅Renderer2官方文档。

此外，正如@GünterZöchbauer指出的那样：

实际上，使用ElementRef非常好。还可以使用Renderer2的ElementRef.nativeElement。不鼓励直接访问ElementRef.nativeElement.xxx的属性。

您可以通过使用elementRef和ViewChild来实现此操作。但是，由于存在以下原因，不建议使用elementRef：

• 安全问题
• 紧密耦合

正如官方ng2文档所指出的那样。

1.使用elementRef(直接访问)：

export class MyComponent {    
constructor (private _elementRef : ElementRef) {
 this._elementRef.nativeElement.querySelector('textarea').focus();
 }
}

2.使用ViewChild（更好的方法）：

 {{ todo.note }}  // <-- changes id to local var
export class MyComponent implements AfterViewInit {
  @ViewChild('tasknote') input: ElementRef;
   ngAfterViewInit() {
    this.input.nativeElement.focus();
  }
}

3.使用renderer：

export class MyComponent implements AfterViewInit {
      @ViewChild('tasknote') input: ElementRef;
         constructor(private renderer: Renderer2){           
          }
       ngAfterViewInit() {
       //using selectRootElement instead of depreaced invokeElementMethod
       this.renderer.selectRootElement(this.input["nativeElement"]).focus();
      }
    }

使用ViewChild和#TemplateVariable如下所示:

 {{ todo.note }} 

在组件中,

最老的方式

import {ElementRef} from '@angular/core';
@ViewChild('someVar') el:ElementRef;
ngAfterViewInit()
{
   this.el.nativeElement.focus();
}

老方式

import {ElementRef} from '@angular/core';
@ViewChild('someVar') el:ElementRef;
constructor(private rd: Renderer) {}
ngAfterViewInit() {
    this.rd.invokeElementMethod(this.el.nativeElement,'focus');
}

更新于 2017 年 03 月 22 日

新方式

请注意，从Angular v4.0.0-rc.3（2017-03-10）开始，有些事情已经改变。
由于Angular团队将弃用invokeElementMethod，上述代码不能再使用。

重大变更

自 4.0 rc.1 开始:

将 RendererV2 重命名为 Renderer2
将 RendererTypeV2 重命名为 RendererType2
将 RendererFactoryV2 重命名为 RendererFactory2

import {ElementRef,Renderer2} from '@angular/core';
@ViewChild('someVar') el:ElementRef;
constructor(private rd: Renderer2) {}
ngAfterViewInit() {
      console.log(this.rd); 
      this.el.nativeElement.focus();      //<<<=====same as oldest way
}

console.log(this.rd)将给出以下方法，您现在可以看到invokeElementMethod不在其中。附加img，因为它尚未记录。

注意: 您可以使用Rendere2的以下方法来做很多事情，带/不带ViewChild变量。