title: Focus on newly added input element
body: <p>I have a new Angular 2 app with a list of <code>input</code> boxes. When the user hits the return key, I add a new <code>input</code> box immediately after the one they're currently editing. Or rather, I (asynchronously) add a new entry to the array in the model, which causes Angular 2 to automatically generate a new <code>input</code> box in the near future.</p>
  
  <p>How can I make it so that <code>input</code> focus changes to the newly added element automatically?</p>
  
  <p><strong>EDIT 1:</strong><br>
  Alternatively, I get a reference to the model object that's causing the DOM to be generated. From the component code, is there a way to search for a DOM element representing a particular model object?</p>
  
  <p><strong>EDIT 2:</strong><br>
  Here's my code to just make this work. Hopefully this is offensive enough to some Angular 2 devs to encourage a reply :-)</p>
  
  <pre><code>app.WordComponent = ng.core
      .Component({
          selector: 'word-editor',
          template:'&lt;input type="text" [value]="word.word" (input)="word.update($event.target.value)" (keydown)="keydown($event)"/&gt;',
          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 &lt; ul.childNodes.length) {
                              ul.lastChild.querySelector('input').focus();
                              clearInterval(interval);
                          }
                      }, 1);
                  });
              }
          }
      });
  </code></pre>