Angular Validation显示提交时的所有错误

Question

我有一个简单的示例表单，它将验证所需的名称和至少3个字母。在使字段变脏时很好地显示错误：

[http://plnkr.co/edit/FEclhN?p=preview]

然而，我们的设计师希望所有为空且“必需”的字段也为“红色”，当用户按下“提交”按钮时。现在，除非他们触摸并使该字段“变脏”，否则验证不会使该字段变红。

当然，字段不应该是红色，只有在他们提交表单或者让字段变脏之后才会开始。

jQueryValidate.org这样做，这也是他们在Angular中想要的东西。

Answer 1

我遇到了同样的要求并通过在我的控制器范围内添加一个布尔值来解决它，以指示表单是否已提交formSubmitted

在我的表单提交方法中，我会将formSubmitted的值设置为true

然后我会在我需要的地方动态添加一个类：

<div ng-class="{'required-error': formSubmitted && formName.field.$error.required}">
    <input name="field" required/>
</div>

Answer 2

您也可以使用它 https://github.com/AngularAgility/AngularAgility 对于烤面包机中的所有控件和错误摘要。 这是验证和关注导致验证的字段的最佳方法。