如何在AngularJS中验证误差后以形式保留值

Question

我的表格中有一个验证。如果用户已经注册，则显示警报并以空值重置表单。我需要警报消息以及数据应保留在表格中。提前致谢。https://plnkr.co/edit/whdrmjmls69yaf6q2uyi?p=preview

 <div class="form-group">
                <label class="control-label col-sm-2" for="firstName">First Name:</label>
                <div class="col-xs-4">
                    <input type="text" class="form-control" id="firstName" ng-disabled="!edit" name="firstName" ng-model="user.firstName" ng-required="true">
                    <span style="color:red" ng-show="userForm.myName.$touched && userForm.myName.$invalid">Please enter a First Name</span>
                </div>
                <label class="control-label col-sm-2">Email:</label>
                <div class="col-xs-4"><input type="email" id="email" class="form-control" ng-disabled="!edit" name="email" ng-model="user.email" ng-required="true">
                    <span style="color:red" ng-show="userForm.email.$touched && userForm.email.$invalid">Please enter valid email ID</span>
                </div>
            </div>
<div class="panel-footer">
            <button type="button" ng-click='edit=!edit'id="Edit" ng-show="!edit" class="btn btn-default" >Edit</button>
            <button ng-show="edit" id="save" type="submit" ng-click='addOrModifyUser(user)' class="btn btn-default"
                    ng-disabled="userForm.$invalid">Save
            </button>
            <a ng-if="user.accountId" ui-sref="account.locations.contacts({accountId: user.accountId})">
                <button type="type" class="btn btn-default">Cancel</button>
            </a>
            </div>

i？p =预览

Answer 1

不知道您的问题是什么，但这就是我在Angular 1.x中解决自定义电子邮件验证的方法。

html：

<form ng-submit="submit()">
    <input type="email" class="form-control" id="email" name="email" placeholder="email" ng-model="formModel.email" />
    <span ng-show="formModel.$submitted && formModel.teamName.$error.exists">Email already exists</span>
</form>

JS：(在您的角控制器中(，其中" emailservice"将是您选择的http服务，如果电子邮件存在于您的后端：

是否存在电子邮件：

myApp.controller('mainController', function($scope, EmailService) {

    $scope.submit = function() {
        $scope.formModel.email.$setValidity("exists", true);
        EmailService.emailExist($scope.formModel.email,  { // check if email exists
            success: function(exists) {
                $scope.$apply(function(){
                    $scope.formModel.email.$setValidity("exists", !exists); // set validation flag
                });
                if($scope.formModel.$valid) {
                    // submit if valid
                }
            }
        }
    }
}

祝你好运！