I'm trying to understand custom form validation in angularjs. I followed an example that defines a directive to set an input
text field as valid or invalid based on whether it contains an 'e' character. That seems to work because the css styling changes based on the validity. However the form still allows the submit button to be pressed even when the field is invalid. The following plunker shows a simple example. It draws a red border for the input field if it's invalid.
Plunker: http://plnkr.co/edit/84NpBl9nmL5Qda96YF8d?p=preview
Note that the 'add' button is disabled if the text field is empty, which is due to the required
attribute, but I wanted the button to be disabled also when the field is invalid. What am I missing? I guess I was hoping that required
would mean "valid" rather than just "not empty".