我想创建一个项目列表，这些项目是简单的可单击文本。每次单击项目时，项目都会转换为输入（文本框），您可以对其进行编辑。我已经做到了。我唯一缺少的是单击项目时将焦点设置在输入元素上。我的HTML代码如下：
<div ng-repeat="item in items">
<span ng-if="!valueIsEditedForItem(item.id)">
<a href="" ng-click="editvalueForItem(item.id)">
{{ item.value }}
</a>
</span>
<span ng-if="valueIsEditedForItem(item.id)">
<input ng-model="edited_value"
ng-keyup="onValueInput($event,item.id,edited_value)"/>
</span>
</div>
<a>元素和<input>元素是两个不同的元素。因此，我的想法是将输入元素以某种方式传递给ng-click="editvalueForItem(item.id)。它应该看起来像这样：
<a href="" ng-click="editvalueForItem(item.id,inputElement)">
{{ item.value }}
</a>
然后我可以通过执行以下操作将焦点设置到输入元素：
inputElement.focus();
我知道$event变量保存$event.target中事件的元素。但是我的活动是在<a>上而不是<input>上。 如何将<input>元素引用到<a> ？
编辑：解决方案
在阅读完答案中的解决方案建议后，我终于通过引用id来实现了这一点：
HTML
<input id="{{'input' + item.id}}"
ng-model="edited_value"
ng-keyup="onInput($event,edited_value)"/>
JS
$scope.editvalueForItem = function (itemId) {
$scope.currentlyEditedItemId = itemId;
// focus on the input element
setTimeout(function () {
var inputElement = document.getElementById("input" + itemId);
if (inputElement) {
inputElement.focus();
}
},0);
};
必须使用setTimeout子句来优先进行元素的初始化。如果删除它，则getElementById命令将返回null，因为输入元素尚未初始化。
但是，创建自己的指令的解决方案将是更合适的选择。