是否有一种Angular2的方法来关注输入域？

Question

this.modelname.fieldname1 = "";
this.modelname.fieldname2 = "";

有没有Angular2的方法可以做到这一点，或者我只是使用老式的JavaScript？

Answer 1

不建议直接在Angular中访问dom。Angular提供Renderer(Angular2)和Renderer2(Angular4)抽象。

以下是在Angular 2中的操作方法：

@Component({
  selector: 'my-app',
  template: `
    <div>
      <input #inp id="myInput" type="text">
      <button (click)="setFocus()">Set Focus</button>
    </div>
  `,
})
export class App {
  @ViewChild('inp') inp:ElementRef;

  constructor(private renderer: Renderer) {
  }

  setFocus() {
    this.renderer.invokeElementMethod(this.inp.nativeElement, 'focus');
  }
}

在Angular4中，Renderer被删除，而Renderer2被添加。invokeElementMethod被删除了，有关于它的讨论:https://github.com/angular/angular/issues/13818#issuecomment-297815331

 let onElement = this.renderer2.selectRootElement('#myInput');
 onElement.focus();