所以我有可变数量的输入字段，保存完之后，我想将焦点返回到它们的第一个。
HTML代码：
<td ng-repeat='col in list.cols'>
<input class='colData' type='text' ng-model='newentry[$index]' on-press-enter="addRow(newentry)">
</td>
正如您可能会读到的那样，在按Enter键时我将调用“ addRow（）”，然后将值添加到我的数据模型中。这很好。
现在，在添加数据之后，我想将焦点设置到这些输入字段中的第一个。
我试图抵制依靠我的jQuery知识的冲动。如果我包括jQuery，我就可以做到$('input.colData').first().focus();。
但是我真的在努力学习以“有角度的方式”做事。
我将如何处理这种情况？
有没有办法通过包含的模型选择输入字段？
谢谢，
J
更新：我不认为这是重复的，因为在我的情况下，我无法向输入字段添加指令，因为它们是由angular动态创建的，并且只应关注第一个。如上所述，它们的数量是可变的。除了jQuery单一代码外，我看不到如何识别其中的第一个。
提交表单后，如何使用指令集中第一个元素？做出以下假设：
有关演示，请参见此jsFiddle。让我知道我是否正确理解了您的问题。
控制器将包含用于管理数据或将资源提交到服务器的代码。然后它将广播一个事件，表明已提交数据。由于原始帖子中未提供任何代码，因此我采取了填补空白的自由。
或者，$promise可以使用a触发事件，这将提供处理任何服务器问题的方法。
function ctrl($scope) {
$scope.items = [ 'thing 1', 'thing 2', 'thing 3' ];
$scope.data = [];
$scope.addRow = function(newEntry) {
var entry = newEntry || 'thing ' + $scope.items.length + 1;
$scope.$evalAsync(function() {
$scope.items.push(entry);
});
};
$scope.submit = function() {
console.log("Simulating a submit");
$scope.$broadcast("formSubmitted");
};
}
指令将通过关注第一个元素来响应事件。后链接用于初始化事件并设置事件的侦听器。当事件被触发时，该元素将被聚焦。这样可以将数据和表示形式清楚地分开。
function onPressEnter() {
return {
restrict : 'A',
scope: {
onPressEnter: '&'
},
link: function($scope, $element, $attr, $ctrl) {
$element.on('keyup', function(e) {
if (e.which === 13) {
$scope.onPressEnter();
}
});
$scope.$on("formSubmitted", function() {
if ($scope.$parent.$first) {
$element[0].focus();
}
});
}
}
};
另外，您可以将此指令隔离为可重用组件，并使用以下命令。您要做的就是将on-submit-focus="0"任何内容添加到第一个子元素上。on-submit-focus="1"会选择第二个孩子，依此类推...这里有更新的演示。
function onSubmitFocus() {
return function($scope, $element, $attr) {
$scope.$on('formSubmitted', function() {
if ($scope.$index === +$attr.onSubmitFocus) {
$element.children()[0].focus();
}
});
};
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句