title: AngularJS focus after creation of new element
body: <p>I am attempting to implement functionality wherein the user is interacting with a list element. Upon pressing enter, a function is called. I want the function to create a new list element immediately after the current element. Once the element is created I want the dom to focus on that element. Here is the code:</p>
  
  <pre><code>$scope.lines.splice(lineNum+1,0, {'data':""});
  document.getElementById(lineNum+1).focus();
  </code></pre>
  
  <p>Where lines is the list of data bound to the list elements. However, the current result is that the first line is run, but the dom element hasn't been created yet. So the second line is run before the dom is updated. For example when you press enter on line 4 it focuses on line 5. Then eventually it makes another line, pushing line 5 to line 6. So the net result is focusing on line 6. </p>
  
  <p>I have messed around with wrapping the first line in a $scope.$apply function but to no avail. </p>