入力後にフォーム入力が必要なメッセージが消えない

Question

を参照this codepen link

角度のある素材を使用して簡単なフォームを作成しました。これについてangular material demoを参照しました。

フィールドには必須とマークされ、入力が行われない場合はfield requiredメッセージが表示されます。しかし、メッセージが有効な入力が行われると消えません。一方、公式のデモでは、これは動作します。

これは、フォームに関連するHTMLコードです：

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

    <div ng-messages="myform.email.$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. 
     </div> 
    </div> 
    </md-input-container> 

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

ここに問題がある可能性がありますか？

Answer 1

ngMessagesをあなたのアプリに挿入するのを忘れました。

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