Sohan Shirodkar Sohan Shirodkar - 11 months ago 53
AngularJS Question

Form input required message doesn't disappear after input is made

Refer this codepen link

I have a simple form built using angular material. have referred angular material demo for this.

The fields are marked required and if the input is not made then a

field required
message is displayed. But the message doesn't vanish once a valid entry is made. Whereas, in the official demo this works.

This is the HTML code pertaining to the form:

<form name="myform">
<md-input-container flex="50">
<input required name="name" ng-model="">
<div ng-messages="$error">
<div ng-message="required">This is required.</div>
<md-input-container class="md-block">
<input required type="email" name="email" ng-model=""
minlength="10" maxlength="100" ng-pattern="/^.+@.+\..+$/" />

<div ng-messages="$error" role="alert">
<div ng-message-exp="['required', 'minlength', 'maxlength', 'pattern']">
Your email must be between 10 and 100 characters long and look like an e-mail address.

<md-button class="md-raised md-primary">Submit</md-button>

What could be the problem here?

Answer Source

You forgot to inject ngMessages to your app.

angular.module('BlankApp', ['ngMaterial', 'ngMessages']);