html - form 表單 使用者名稱提示和錯誤提示分開顯示？

Question

點選輸入框，顯示使用者名稱提示，點選立即註冊按鈕，在輸入框下顯示錯誤提示

<form class="form-horizontal" name="checkForm" ng-init="isEmpty=false;">
    <p class="form-group">
        <label class="col-sm-3 control-label">用 户 名</label>
        <p class="col-sm-8 account">
            <input type="text" class="form-control showHide" placeholder="您的账户名和登录名"
                ng-model="account"
                name="account"
                required="required"
                ng-pattern="regularList.account"
                ng-blur="checkForm.account.$blured = false;"
                ng-focus="checkForm.account.$blured = true;"
                autocomplete="off"/>
            <span ng-class="{'right':(checkForm.account.$error.pattern),'error':checkForm.account.$valid}"></span>
        </p>
        <span ng-messages="isEmpty && checkForm.account.$blured && checkForm.account.$error" role="alert">
            <span class="error_text" ng-message="required" style="color: #ff0000">用户名不能为空</span>
        </span>
        <span ng-messages="checkForm.account.$blured && checkForm.account.$error" role="alert">
            <span class="error_text" ng-message="pattern"style="color: #ff0000">用户名为4-20位中文数字与英文字母组成！</span>
        </span>
    </p>
    <p class="tip-container" ng-if="checkForm.account.$blured==true">
        <p class="input-tip" ng-show="checkForm.account.$blured">
            <i></i>
            <span>!支持中文、字母、数字、“-”“_”的组合，4-20个字符</span>
        </p>
    </p>

具體效果如下

現在是輸入內容不希望顯示錯誤提示
我現在的問題是，輸入對應的內容，會有錯誤的提示，效果見下

目的：輸入內容不提示錯誤，點選立即註冊，如果不符合對應的規範，再提示錯誤。
求指點，謝謝

Answer 1

也是醉了。 。 。

            ng-model="account"
            ng-pattern="regularList.account"/>

        <span class="error_text" style="color: #ff0000">用户名为4-20位中文数字与英文字母组成！</span>

當使用者提交的時候，在controller中用正規判斷$scope.account是否合法，不合法的話，就讓$scope.showAccountError=true.在頁面初始化的時候給這個變數賦false。