我有一个模型对象列表，这些模型对象显示在视图中，其中包含可编辑的元素ng-repeat指令。input有一个Add new按钮可以将新项目添加到列表中，这会创建一个新的空input. 但是，一旦在视图中创建了新的空输入，我希望它能够聚焦并准备好进行编辑。我不知道该怎么做，因为我几乎无法访问控制器中的 DOM，而控制器是我将新的空模型添加到列表中的地方。
我还是 AngularJS 的新手，写这个应用程序来学习。所以，请让我知道我在实施过程中做错的任何其他事情。
Plunker：http ://plnkr.co/Ig4OtuUtFatIknO1Kfxi
有趣的代码片段：
HTML：
<body ng-controller=PlanetCtrl>
<div>
<input ng-repeat='it in planets' type=text ng-model=it.name edit-spotlight>
</div>
<button ng-click=addNew() class='btn btn-primary'>+ Add new item</button>
<div id=spotlight-shadow></div>
</body>
Javascript：
angular.module('planet-man', []).
// ... editSpotlight directive ...
function PlanetCtrl ($scope) {
$scope.planets = [
{name: 'Mercury'},
{name: 'Venus'},
{name: 'Earth'},
{name: 'Mars'}
];
$scope.addNew = function () {
$scope.planets.push({name: ''});
};
}
正如您从 plunker 中看到的那样，当Add单击按钮时，视图中会添加一个新输入，但必须手动将其聚焦。Add我希望它在单击按钮时立即获得焦点（并出现聚光灯效果） 。
谢谢你。