angularjs - How to make ngMessage for required fields only show when dirty or submitting a form?

Question

I'm using AngularJS 1.3.0 RC0 and angular-messages. ng-messages dutifully shows error messages for those "required" fields when a form is initially loaded and pristine. So the newly loaded form page is filled up with error messages. This is not what I want. How to make ngMessage for required fields only show when those fields are dirty or submitting a form?

I have read the official doc, no clue. And tried to put "ng-show = "fieldName.$dirty"" in the ng-messages div, did not work. Any help would be highly appreciated!

Answer 1

Use the ng-if attribute to check for $dirty on the tag that has ng-messages.

Example :

<div ng-messages='myForm.myControl.$error' ng-if='myForm.myControl.$dirty'>
    <div ng-message='required'>Required field</div>
</div>