我也是带着同样的问题来的。对我来说(在需要的时候注入隐藏元素——比如在工作应用程序中接受教育)有必要的标志。

我意识到，验证器对注入文件的启动速度比文档准备好还要快，因此它会报错。

我最初的ng-required标记使用可见性标记(vm.flags.hasHighSchool)。

我通过创建一个专用标志来设置required来解决这个问题 ng-required = " vm.flags。highSchoolRequired == true"

我添加了一个10ms的回调设置标志，问题解决了。

 vm.hasHighSchool = function (attended) {

        vm.flags.hasHighSchool = attended;
        applicationSvc.hasHighSchool(attended, vm.application);
        setTimeout(function () {
            vm.flags.highSchoolRequired = true;;
        }, 10);
    }

Html:

<input type="text" name="vm.application.highSchool.name" data-ng-model="vm.application.highSchool.name" class="form-control" placeholder="Name *" ng-required="vm.flags.highSchoolRequired == true" /></div>

使用ElementInternals API的自定义元素元素不能使用delegatesFocus: true与shadowRoot，因为元素必须直接接收焦点(目前，这可能会发展)在公开的表单的DOM树(父表单可以在shadowRoot，它只是必须在同一部分的树与自定义和其他表单元素);元素必须是可见的，在我的实验中tabindex=0是必需的元素(-1似乎也工作)

一个从googlchrome扩展的带有自定义元素的演示在https://jimmont.github.io/samples/report-validity/

the error is simply reporting that an element which has attributes indicating it needs validation cannot receive focus when there's a problem with the validation, so the user can correct the error; if the error and information is coming in as expected you can ignore the error; otherwise it's likely the result of some UI features hiding elements and a mix of unexpected behavior; it's possible to use another approach in implementations to allow the user to walk back through a flow of some sort, but it appears that's beyond the scope of the question at the moment

在表单中添加novalidate属性将有助于:

<form name="myform" novalidate>

以防其他人有这个问题，我也经历过同样的事情。正如评论中所讨论的，这是由于浏览器试图验证隐藏字段。它在表单中寻找空字段并试图集中在它们上，但是因为它们被设置为display:none;，所以它不能。因此出现了错误。

我可以用类似的方法来解决这个问题:

$("body").on("submit", ".myForm", function(evt) {

    // Disable things that we don't want to validate.
    $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", true);

    // If HTML5 Validation is available let it run. Otherwise prevent default.
    if (this.el.checkValidity && !this.el.checkValidity()) {
        // Re-enable things that we previously disabled.
        $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", false);
        return true;
    }
    evt.preventDefault();

    // Re-enable things that we previously disabled.
    $(["input:hidden, textarea:hidden, select:hidden"]).attr("disabled", false);

    // Whatever other form processing stuff goes here.
});

此外，这可能是重复的“无效的窗体控件”只有在谷歌Chrome

对我来说，问题是在div中输入类型电子邮件的可见性:隐藏，类似这样的东西

<form>
  <div style="visibility: hidden;">
  <input type="email" name="email" id="email">
  ............
</form>

然后你可以改变type="email"为type="text"或删除可见性:隐藏;

它可以是你有隐藏(display: none)字段和必需的属性。

请检查所有必填字段是否对用户可见:)