程序问答   发布时间:2022-06-01  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了将重点放在AngularJs表单中的第一个无效输入上大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

如何解决将重点放在AngularJs表单中的第一个无效输入上?

开发过程中遇到将重点放在AngularJs表单中的第一个无效输入上的问题如何解决?下面主要结合日常开发的经验,给出你关于将重点放在AngularJs表单中的第一个无效输入上的解决方法建议,希望对你解决将重点放在AngularJs表单中的第一个无效输入上有所启发或帮助;

您也可以使用angular.element

angular.element('input.ng-invalID').first().focus();

<form name="myForm" novalIDate="novalIDate" data-ng-submit="myAction(myForm.$valID)" @R_403_6843@complete="off"></form>

$scope.myAction= function(isValID) {
    if (isValID) {
        //You can place your AJAX call/http request here
    } else {
        angular.element('input.ng-invalID').first().focus();
    }
};

使用Ngmessages进行验证

angular.element($document[0].querySELEctor('input.ng-invalID')).focus();

使用此方法时,需要$document在角度控制器中作为参数传递

angular.module('mymodule')
.controller('myController', ['$document', '$scope', function($document, $scopE){
    // Code Here
}]);

解决方法

我已经阅读了几篇有关AngularJs的焦点设置的文章和StackOverflow问题。

不幸的是,我阅读的所有示例都假定我可以将一些属性添加到元素中以获得焦点,例如focusMe指令。

但是,如果我事先不知道将焦点设置为哪个输入怎么办?特别是如何将焦点设置为具有$ invalid集的表单中的第一个输入元素-即未通过验证的元素。可能有几个输入未通过验证,因此我不能使用仅以此为基础尝试调用.focus()的指令。(我这样做是出于可访问性/WCAG的原因,它的优良作法是在单击提交以最大程度地减少按键以查找未通过验证的字段时这样做)。

$ error对象将提供所有未通过验证的控件,但它们会按照失败的类型而不是在表单上出现的顺序进行分组。

我敢肯定,我可以想出一些行之有效的方法。表单上的伪指令,当需要设置焦点时会接收一些广播-该伪指令可以搜索第一个$invalid元素。但是,这似乎非常复杂,我想知道这些是否是更好的“角度”实现方式。

大佬总结

以上是大佬教程为你收集整理的将重点放在AngularJs表单中的第一个无效输入上全部内容,希望文章能够帮你解决将重点放在AngularJs表单中的第一个无效输入上所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: