关注新添加的输入元素

Question

我有一个新的角2应用程序和一个列表input盒子。当用户按下返回键时，我将添加一个新的input框位于当前正在编辑的框后面。或者说，我(异步地)在模型中的数组中添加了一个新条目，这将导致角2自动生成一个新的input在不久的将来。我怎样才能做到input自动将焦点更改到新添加的元素？编辑1：或者，我得到一个模型对象的引用，该对象导致生成DOM。从组件代码中，是否有一种方法可以搜索表示特定模型对象的DOM元素？编辑2：这是我的代码，让这一切顺利进行。希望这是足以冒犯一些角度2的发展，以鼓励回答：-)app.WordComponent = ng.core     .Component({         selector: 'word-editor',         template:'<input type="text" [value]="word.word" (input)="word.update($event.target.value)" (keydown)="keydown($event)"/>',         styles:[             ''         ],         properties:[             'list:list',             'word:word'         ]     })     .Class({         constructor:[             function() {             }         ],         keydown:function(e) {             if(e.which == 13) {                 var ul = e.target.parentNode.parentNode.parentNode;                 var childCount = ul.childNodes.length;                 this.list.addWord("").then(function(word) {                     var interval = setInterval(function() {                         if(childCount < ul.childNodes.length) {                             ul.lastChild.querySelector('input').focus();                             clearInterval(interval);                         }                     }, 1);                 });             }         }     });

Answer 1

这可能就是你要找的：

import {Component, ViewChild} from 'angular2/core'

@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <div>
      <input #name>
    </div>
  `,
  directives: []
})
export class App {

  @ViewChild('name') vc: ElementRef;

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