Question

我有角度验证和服务器端验证（如用户名）。我绑定服务器错误以形成元素。

$scope.registerFormSubmit = function()
{
    if (isEmpty($scope.registerForm.$error))
    {
        $http({
            url: '/profile/register',
            method: 'POST',
            dataType: 'json',
            data: toArray($scope.form),
        }).error(function(response){
            if (false == is(response.formErrors)) return;
            for (var k in $scope.registerForm)
            {
                if (!is(response.formErrors[k]))
                {
                    try
                    {
                        $scope.registerForm[k].$error = {};
                    }catch(e){

                    }

                    continue;
                }
                else
                {
                    $scope.registerForm[k].$error[response.formErrors[k]] = 1;
                }
            }

        });
    }
}

问题是，在提交点击后，用户更改模型（例如用户名）错误仍然存在。因此，ajax无法发送，因为条件

isEmpty($scope.registerForm.$error)

总是假的，因为表单有错误。

Answer 1

在此处对使用Angular和服务器端验证进行了非常全面的讨论：AngularJS: integrating with server-side validation

我用过的轻量级解决方案：

键入错误，以便您知道它们是服务器错误。为了保留特定错误的知识，您可以在当前的错误处理程序中执行类似的操作：

$scope.registerForm[k].$error.server = 'Error-specific string. Could also be an object';

清除输入更改时的服务器错误。这是在keydown上执行它的示例指令：

angular.module('myApp')
  .directive('serverError', function () {
    return {
      restrict: 'A',
      require: 'ngModel',
      link: function(scope, element, attrs, ngModel) {
        element.on('keydown', function() {
          return ngModel.$setValidity('server', true);
        });
      }
    };
  });

<input type="text" ng-model="username" placeholder="coolguy" server-error />

然后，您可以将server-error指令应用于所有表单元素。

AngularJS在验证之前清除错误

1 个答案: