Angularjs 为什么在Angular中添加ng pristine ng invalid ng invalid required类

我试图在Angular中实现表单验证

这里是html

<input type="email" placeholder="Email" ng-model="form.emailId"  name="email" required />

它正在添加类 ng原始ng无效ng无效必需ng有效电子邮件

默认情况下显示红色边框

我不想在默认情况下显示红色边框。我只想在提交时显示。使用HTML5验证

有什么想法吗？如何解决这个问题

非常感谢

这是一篇有用的文章，介绍了您需要了解的所有内容：特别是：

我将文章中的一些文本包括在内，以供参考：

有时，在用户键入时显示错误是不可取的。当用户在表单中键入时，当前会立即显示错误。这是因为Angular强大的数据绑定功能。由于所有内容都会立即更改，因此在讨论表单验证时，这可能是一个缺点

对于只希望在提交表单后显示错误的场景，可以稍微调整上述代码

您需要删除submit按钮上禁用的ng，因为我们希望用户能够提交表单，即使表单不完全有效

您应该在表单提交后添加一个变量。在submitForm（）函数中，只需添加$scope.submitted=true；。这会在表单提交后将提交的变量存储为true

将错误规则从ng class=“{'has error'：userForm.name.$invalid&&！userForm.name.$pristine}”调整为ng class=“{'has error'：userForm.name.$invalid&&！userForm.name.$pristine&&submitted}”。这样可以确保只有在提交表单后才会显示错误。您需要调整所有其他ng类和ng show以考虑此变量。 现在，仅当提交的变量设置为true时，表单才会显示错误

---

通常红色边框是由引导CSS模块（在“form group”或“control group”中）引起的，请确保标记类中没有“has feedback”或“has error”（只需删除它们）。Angular通常处理模型或后端，而不直接处理前端

---

检查此问题的另一种方法是检查Chrome浏览器中的开发人员工具。查看哪个CSS（通常在[elements]选项卡中）负责添加红色边框。

这是因为它是必需的。如果没有输入值，则设置必需的验证错误键。这就是angular放置这些类的原因。@squiroid:你怎么能告诉我。我想用html5验证在提交时验证表单。Thanks@HituBansal把novalidate属性放在表单标签里，我做了。仍然不起作用如果您需要删除必需的属性..虽然此链接可以回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，则仅链接答案可能无效。ngForm已提供表单是否已提交（类似于$pristine）。此外，OP应使用ngModelOptions设置何时进行验证。请参阅