如何使ngMessage的必填字段只显示脏或提交表单？
我正在使用AngularJS 1.3.0 RC0和angular度消息。 当最初加载表单并且原始的时候，ng-messages忠实地显示那些“required”字段的错误信息。 所以新加载的表单页面充满了错误信息。 这不是我想要的。 只有当这些字段脏或提交表单时，如何使ngMessage显示必填字段？
我已经看过官方文件了，不知道。 并试图把ng-message div中的“ng-show =”fieldName。$ dirty“”，不起作用。 任何帮助将不胜感激！
使用ng-if属性在含有ng-messages的标签上检查$dirty 。
例如：
<div ng-messages='myForm.myControl.$error' ng-if='myForm.myControl.$dirty'> <div ng-message='required'>Required field</div> </div>
做到这一点的最好方法是$ touch：
<div class="help-block" ng-messages="userForm.name.$error" ng-show="userForm.name.$touched"> ... </div>
只有肮脏：
<div ng-messages="myForm.myField.$dirty && myForm.myField.$error"> <div ng-message='required'>Required field</div> </div>
只有在提交表格的情况下：
<div ng-messages="myForm.$submitted && myForm.myField.$error"> <div ng-message='required'>Required field</div> </div>
而不是使用ng-ifbuild议你可以做一些像…
<div ng-messages='myForm.myControl.$error' ng-if='submitted'> <div ng-message='required'>Required field</div> </div>
然后在你的提交button上添加：
ng-click="submitted=true"
你可能想再次键入'$ scope.submitted'时重新inputfalse，所以你可以把它添加到你的文本/电子邮件input中：
ng-keyup="submitted=false"
这样，只有提交button将“$ scope.submitted”更改为true，并且您所做的一切都将其设置为false，因此隐藏了错误消息，直到您单击“提交”button。
我不想显示我的消息，直到有任何错误或用户尝试提交页面，并没有上述解决scheme的工作。
最后我终于成功了这个：
<form name='frmUser'> .......... .......... <div ng-messages="frmUser.firstName.$error" ng-show='frmUser.$submitted || frmUser.firstName.$dirty' role="alert"> <div ng-message="required" class="err">Required</div> <div ng-message="maxlength" class="err">Maximum 50 characters.</div> </div> <input ng-model="model.first" name="firstName" type="text" ng-required="true" ng-maxlength="50" placeholder="Enter your first name" /> </form>
如果input任何无效的内容，则显示错误
如果您尝试提交页面，而您没有提供必填字段，则会显示错误。
在满足条件后错误信息是否仍然出现？ 在这种情况下，你是否记得在angular度模块中依赖ngMessages ？ 例如：
angular.module("exampleModule", ["ngMessages"]);
我发现这个答案很有帮助，但并没有解决错误信息永远悬挂的问题。 我想出了一个比较复杂的show和hide的用法，如下所示：
<div class="help-block" ng-messages="addPlanForm.planName.$error" ng-show="addPlanForm.$submitted || addPlanForm.planName.$dirty || (addPlanForm.planName.$invalid && addPlanForm.planName.$touched)"> <p ng-message="required" ng-hide="addPlanForm.planName.$valid">Your name is required.</p> </div>
通过在发生错误时生成的消息添加ng-hide，当用户纠正错误时，消息将消失。 方式很酷。 我喜欢angular度。
我一直在努力，发生了什么是我的NG消息没有出现，因为默认的浏览器行为不允许无效的表单提交ng-required =“true”。 要解决这个问题，你可以用novalidation来修饰表单。 这里是我的完整工作示例：
<form name="myForm" novalidate ng-submit="myForm.$valid && controllSideSubmitHandle()"> <input type="text" name="name" ng-model="myScope.name" ng-required="true"> <div ng-messages="myForm.$error || myForm.$submitted" style="color:maroon" role="alert" ng-if="myForm.name.$dirty || myForm.$submitted"> <div ng-message="required">Name is required.</div> </div> <input type="submit" value="Submit"/> </form>
我用css规则解决了这个问题
[ng-messages] { display: none; color:red; } .ng-dirty [ng-messages] { display:block }
而已..
对我来说就像一个魅力。
这是一个暴徒
Angular使用类是惊人的，你可以用它做很多事情！
试试这个
<div ng-messages='myForm.fieldName.$error && (myForm.fieldName.$dirty || myForm.$submitted)' > <div ng-message='required'>Required field</div> </div>
<input required type="text" ng-model="model" name="field" ng-maxlength="13" ng-minlength="10"> <div ng-messages="form.field.$error" ng-if='form.$submitted'> <p ng-message="required">Required</p> <p ng-message="maxlength">not a valid field. Length exceeds.</p> <p ng-message="minlength">not a valid field. Length is shorter.</p> </div>
buttontypes应submit ，这将工作。
如果您使用的是AngularJS Material，那么很多这种function都是开箱即用的！ 只要记住将所有内容放在<md-input-container> 。
这是一个codepen的例子，所以你可以看到它的外观。 这不仅在input被点击之前隐藏了错误，还会添加一些漂亮的红色样式和animation，当它显示出来时！
这是实际的代码：
<form name="books" novalidate> <md-input-container> <input ng-model="title" name="title" required/> <div ng-messages="books.title.$error"> <div ng-message="required">Title is required</div> </div> </md-input-container> </form>
