javascript - AngularJS 1.5.6 reset form & ng-messages -

i read stackoverflow posts how reset form, doesn't it. input valid error message shown. debugging application shows me message gets style="opacity: 1;margin-top: 0px;", have no idea where.

<md-input-container flex style="margin-top: 0;margin-bottom: 5px">     <label translate>maintenancemessage.description</label>     <input md-maxlength="40" required name="description" md-no-asterisk            ng-model="maintenancemessagectrl.newmaintenancemessage.description" flex>     <div ng-messages="maintenancemessageform.description.$error" ng-if="maintenancemessageform.description.$touched">       <div ng-message="required" translate>maintenancemessage.description.requiredmessage</div>       <div ng-message="md-maxlength" translate>maintenancemessage.description.maxlengthmessage</div>     </div>   </md-input-container> 

on reset execute following function

  ctrl.resetformandhidedialog = function () {   ctrl.newmaintenancemessage = {};   ctrl.newmaintenancemessage.expirationdate = new date();   ctrl.showlastmodification = false;   $scope.maintenancemessageform.$setuntouched();   $scope.maintenancemessageform.$setpristine();   $mddialog.hide(); }; 

am missing something?

thanks helping.

---

conclusio: seems angular material 1.1.1 has bug. ng-message wasn't hidden.

i've put relevant markup , code codepen , seems fine - codepen

the odd thing character count not set 0 on form reset. maybe bug.

markup

<div ng-controller="appctrl" ng-cloak="" ng-app="myapp">    <form name="maintenancemessageform">     <md-input-container flex style="margin-top: 0;margin-bottom: 5px">       <label>maintenancemessage.description</label>       <input md-maxlength="40" required name="description" md-no-asterisk ng-model="newmaintenancemessage.description" flex>       <div ng-messages="maintenancemessageform.description.$error" ng-if="maintenancemessageform.description.$touched">         <div ng-message="required">{{maintenancemessage.description.requiredmessage}}</div>         <div ng-message="md-maxlength">{{maintenancemessage.description.maxlengthmessage</div>       </div>     </md-input-container>   </form>   <md-button class="md-raised md-primary" ng-click="resetform()">reset</md-button> </div> 

js

angular.module('myapp',['ngmaterial', 'ngmessages', 'material.svgassetscache', 'ngdialog'])  .controller('appctrl', function($scope) {   $scope.maintenancemessage = {     description: {       requiredmessage: "this required",       maxlengthmessage: "max length 40"     }   };    $scope.resetform = function () {     $scope.newmaintenancemessage = {};     $scope.maintenancemessageform.$setuntouched();     $scope.maintenancemessageform.$setpristine();   }; });