angularjs - フォームに Material Design Lite と Angular を使用する方法

Question

*免責事項: この質問は、Angular アプリでのマテリアル デザインの使用に関するものではなく、フォーム内でのマテリアル デザインライトの使用に関するものです。だから、答えないでください。私はむしろ角度のある素材、マテリアライズ、lumx、素材のブートストラップ、またはデーモンナイトを使用する必要があります...私は知っています、それらは存在します.*

Angular では、名前の典型的なフォーム フィールドは次のようになります。

<form name="myForm">
  <label>
  Enter your name:
    <input type="text"
        name="myName"
        ng-model="name"
        ng-minlength="5"
        ng-maxlength="20"
        required />
  </label>
  <div ng-messages="myForm.myName.$error" style="color:maroon" role="alert">
    <div ng-message="required">You did not enter a field</div>
    <div ng-message="minlength">Your field is too short</div>
    <div ng-message="maxlength">Your field is too long</div>
  </div>
</form>

Material Design Lite を使用すると、次のようになります。

<form action="#">
  <div class="mdl-textfield mdl-js-textfield">
     <input class="mdl-textfield__input" type="text" id="user" pattern="[A-Z,a-z, ]*" />
     <label class="mdl-textfield__label" for="user">User name</label>
     <span class="mdl-textfield__error">Letters and spaces only</span>
  </div>
</form>

質問: Angular 検証機能を ngMessage (複数のエラー メッセージ用) と組み合わせて Material Design Lite で使用するにはどうすればよいですか?