angularjs中form表單提交驗證

angular.module("MyApp",["ngMessages"])；

<form name="formMyName" ng-submit="$ctrl.changePassword(formMyName)" ng-cloak novalidate>
　　<--輸入新密碼-->
　　<md-input-container md-no-float>
   　　<input name="newPassword" type="password" ng-model="$ctrl.data.newPassword" placeholder="請輸入密碼" 
　　　　　　ng-pattern='/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[~!@#$%^&*(),.])[\da-zA-Z~!@#$%^&*(),.]{6,}$/'minlength="6" maxlength="20"required/>
　　　　//錯誤：$error
　　　　//用法：formMyName.指定所驗證的input框的name.$error
　　　　//解釋：當當前表單所有驗證都通過時$error值為false表示驗證通過，當所有驗證中存在驗證失敗的情況，$error值為true，則驗證不通過。
   　　<div class="errors" ng-messages="formMyName.newPassword.$error">
　　　　<--formMyName對應form表單name,newPassword對應input輸入框name,ng-message驗證的是form表單下name為newPassword的input框中ng-pattern、minlength、maxlength、required這些驗證是否通過,
　　　　當驗證不通過時$error為false就會執行ng-message-exp並顯示下面的提示,反之當驗證通過時$error為true。-->
       　　<div ng-message-exp=['required','minlength','maxlength','pattern']>
          　　您需要輸入6-20位密碼，且必須包括數字、大寫字母、小寫字母、非數字字符。
       　　</div>
　　　　</div
　　</md-input-container>

　　<--輸入確認密碼-->
　　<md-input-container md-no-float>
　　　　<input name="confirmPassword" type="password" ng-modal="$ctrl.data.confirmPassword" placeholder="請輸入確認密碼"/>
　　　　//表單提交時驗證條件：$submitted
　　　　//用法：<p ng-if=“formMyName.$submitted $$ 驗證條件”>錯誤提示</p>
　　　　<p ng-if="formMyName.$submitted && $ctrl.data.newPassword != $ctrl.data.confirmPassword">
　　　　　　確認密碼必須和新密碼一致
　　　　</p>
　　<--在這個地方確認密碼只需要驗證確認輸入的密碼和新密碼是否一致就可以了,不需要再去驗證最小、最大長度和是否必填那些，因為如果兩次密碼一致的話上面那些驗證是一定通過的,如果兩次密碼不一致上面那些驗證也就沒有意義的,
　　　　然后我們可以看到,這里用的是ng-if進行的判斷,但是ng-if不屬於表單驗證,所以后面我們需要用js再進行驗證。我們看ng-if里面的條件，formMyName對應form表單name,$submitted表示的是當點擊提交按鈕時進行驗證。-->
　　</md-input-container>

　　<md-button type="submit">
　　　　提交
　　</md-button>
</form>

angular.module('').controller('', [
    '$rootScope', '$mdDialog',
    function ($rootScope, $mdDialog) {
        var data = this.data = {
            Password: null,
            ConfirmPassword: null
        };
　　　　//修改密碼
        this.changePassword = function (changePasswordForm) {
　　　　//驗證輸入內容有沒有通過表單驗證
　　　　//驗證確認密碼與新密碼是否一致
　　　　　　　　//未通過驗證的表單：$invalid
　　　　　　　　//用法：formMyName.$invalid或者formMyName.指定所驗證的某個input框的name.$invalid
　　　　　　　　//解釋：當表單未通過驗證時，值為true，反之測為false。
            if (formMyName.$invalid || data.Password != data.ConfirmPassword) {
                return
            }
            $mdDialog.hide(data.Password);
        };
    }
]);