我已经阅读了几个文章和StackOverflow问题有关焦点的AngularJs的设置。
不幸的是，我已经读过的所有例子假设有一些属性，我可以添加到元素获得焦点，例如。 a focusMe directive。
但是如果我不提前知道哪个输入设置焦点怎么办？特别是如何设置焦点到具有$ invalid set的形式的第一个输入元素 – 即验证失败的元素。可能有几个输入失败验证，所以我不能使用一个指令，只是试图调用基于这个.focus()。 (我这样做的辅助功能/ WCAG的原因，其良好做法这样做提交被点击，以最小化按键，找到第一个字段，验证失败)。
$ error对象将给所有未通过验证的控件，但是它们按故障类型分组，不按表单上的任何顺序排列。
我相信我可以想出一些kludge这样做的方式。窗体上的指令，当需要设置焦点时接收一些广播 – 然后该指令可以搜索第一个$ invalid元素。但是这似乎很复杂，我想知道这是否是一个更好的“有角度”的方式这样做。
好吧，所以答案比我想象的简单。
所有我需要的是一个指令放在表单本身，一个事件处理程序正在查找提交事件。然后可以遍历DOM寻找第一个具有.ng-invalid类的元素。
使用jQLite的示例：
myApp.directive('accessibleForm',function () {
return {
restrict: 'A',link: function (scope,elem) {
// set up event handler on the form element
elem.on('submit',function () {
// find the first invalid element
var firstInvalid = elem[0].querySelector('.ng-invalid');
// if we find one,set focus
if (firstInvalid) {
firstInvalid.focus();
}
});
}
};
});
此处的示例使用Attribute伪指令，您可以扩展示例以使其成为元素伪指令(限制：’E’)，并包含将其转换为a的模板。然而这是个人偏好。
