我在一些项目中需要这个，所以我创建了一个指令，最后花了一点时间把它放在GitHub上，供任何想要一个直接解决方案的人使用。
https://github.com/webadvanced/ng-remote-validate

特点：

• 提供 AJAX 验证任何文本或密码输入的解决方案
• 与内置的Angular 验证一起使用，可以在formName. inputName.$error.ngRemoteValidate中访问
• 限制服务器请求（默认值为400毫秒），可以使用ng-remote-throttle="550"进行设置
• 允许使用ng-remote-method="GET"的HTTP方法定义（默认POST）要求用户输入其当前密码和新密码的更改密码表单的示例用法。注意：

更改密码

当前要求当前密码不正确。请输入当前帐户密码。

<label for="newPassword">New</label>
<input type="password"
       name="newPassword"
       placeholder="New password"
       ng-model="password.new"
       required>

<label for="confirmPassword">Confirm</label>
<input ng-disabled=""
       type="password"
       name="confirmPassword"
       placeholder="Confirm password"
       ng-model="password.confirm"
       ng-match="password.new"
       required>
<span ng-show="changePasswordForm.confirmPassword.$error.match">
    New and confirm do not match
</span>

<div>
    <button type="submit" 
            ng-disabled="changePasswordForm.$invalid" 
            ng-click="changePassword(password.new, changePasswordForm);reset();">
        Change password
    </button>
</div>

作为变体

// ES6 form controller class

class FormCtrl {
 constructor($scope, SomeApiService) {
   this.$scope = $scope;
   this.someApiService = SomeApiService;
   this.formData = {};
 }

 submit(form) {
   if (form.$valid) {
     this.someApiService
         .save(this.formData)
         .then(() => {
           // handle success

           // reset form
           form.$setPristine();
           form.$setUntouched();

           // clear data
           this.formData = {};
         })
         .catch((result) => {
           // handle error
           if (result.status === 400) {
             this.handleServerValidationErrors(form, result.data && result.data.errors)
           } else {// TODO: handle other errors}
         })
   }
 }

 handleServerValidationErrors(form, errors) {
  // form field to model map
  // add fields with input name different from name in model
  // example: <input type="text" name="bCategory" ng-model="user.categoryId"/>
  var map = {
    categoryId: 'bCategory',
    // other
  };

  if (errors && errors.length) {
    // handle form fields errors separately
    angular.forEach(errors, (error) => {
      let formFieldName = map[error.field] || error.field;
      let formField = form[formFieldName];
      let formFieldWatcher;

      if (formField) {
        // tell the form that field is invalid
        formField.$setValidity('server', false);

        // waits for any changes on the input
        // and when they happen it invalidates the server error.
        formFieldWatcher = this.$scope.$watch(() => formField.$viewValue, (newValue, oldValue) => {
          if (newValue === oldValue) {
            return;
          }

          // clean up the server error
          formField.$setValidity('server', true);

          // clean up form field watcher
          if (formFieldWatcher) {
            formFieldWatcher();
            formFieldWatcher = null;
          }
        });
      }
    });

  } else {
    // TODO: handle form validation
    alert('Invalid form data');
  }
}

据我所知，这个问题是关于从服务器向客户端传递错误的。我不确定是否有成熟的实践。所以我将描述一种可能的方法：

<form name="someForm" ng-submit="submit()" ng-controller="c1" novalidate>
    <input name="someField" type="text" ng-model="data.someField" required>
    <div ng-show="someForm.$submitted || someForm.someField.$touched">
        <div ng-show="someForm.someField.$error.required" class="error">required</div>
        <div ng-show="someForm.someField.$error.someError" class="error">some error</div>
    </div>
    <input type="submit">
</form>

假设服务器返回以下类型的对象：

{errors: {
    someField: ['someError'],
}}

然后，您可以通过以下方式将错误传递到UI：

Object.keys(resp.errors).forEach(i => {
    resp.errors[i].forEach(c => {
        $scope.someForm[i].$setValidity(c, false);
        $scope.someForm[i].$validators.someErrorResetter
            = () => $scope.someForm[i].$setValidity(c, true);
    });
});

我使每个字段无效并添加一个验证器（实际上不是验证器），因为每次更改后都会调用验证器，所以我们可以重置错误状态。
你可以尝试一下here，你也可以试试ngMessages，还有几个relatedarticles。

我最近也在玩这类东西，我搞到了this demo，我想它能满足你的需要。
使用您要使用的任何特定客户端验证正常设置表单：

<div ng-controller="MyCtrl">
    <form name="myForm" onsubmit="return false;">
        <div>
            <input type="text" placeholder="First name" name="firstName" ng-model="firstName" required="true" />
            <span ng-show="myForm.firstName.$dirty && myForm.firstName.$error.required">You must enter a value here</span>
            <span ng-show="myForm.firstName.$error.serverMessage">{{myForm.firstName.$error.serverMessage}}</span>
        </div>
        <div>
            <input type="text" placeholder="Last name" name="lastName" ng-model="lastName"/>
            <span ng-show="myForm.lastName.$error.serverMessage">{{myForm.lastName.$error.serverMessage}}</span>
        </div>
        <button ng-click="submit()">Submit</button>
    </form>
</div>

还请注意，我为每个字段添加了一个serverMessage：

<span ng-show="myForm.firstName.$error.serverMessage">{{myForm.firstName.$error.serverMessage}}</span>

这是一个从服务器返回的可定制消息，它的工作方式与任何其他错误消息相同（据我所知）。
下面是控制器：

function MyCtrl($scope, $parse) {
      var pretendThisIsOnTheServerAndCalledViaAjax = function(){
          var fieldState = {firstName: 'VALID', lastName: 'VALID'};
          var allowedNames = ['Bob', 'Jill', 'Murray', 'Sally'];
          
          if (allowedNames.indexOf($scope.firstName) == -1) fieldState.firstName = 'Allowed values are: ' + allowedNames.join(',');
          if ($scope.lastName == $scope.firstName) fieldState.lastName = 'Your last name must be different from your first name';
          
          return fieldState;
      };
      $scope.submit = function(){
          var serverResponse = pretendThisIsOnTheServerAndCalledViaAjax();

          for (var fieldName in serverResponse) {
              var message = serverResponse[fieldName];
              var serverMessage = $parse('myForm.'+fieldName+'.$error.serverMessage');
              
              if (message == 'VALID') {
                  $scope.myForm.$setValidity(fieldName, true, $scope.myForm);
                  serverMessage.assign($scope, undefined);
              }
              else {
                  $scope.myForm.$setValidity(fieldName, false, $scope.myForm);
                  serverMessage.assign($scope, serverResponse[fieldName]);
              }
          }
      };
}

我假装用pretendThisIsOnTheServerAndCalledViaAjax调用服务器，你可以用 AJAX 调用代替它，关键是它只返回每个字段的验证状态。在这个简单的例子中，我使用值VALID来指示字段是有效的，任何其他值都被视为错误消息。你可能需要更复杂的东西！
从服务器获得验证状态后，只需更新表单中的状态。
您可以从scope访问表单，在本例中，表单名为myForm，因此$scope.myForm可以获取表单（如果您想了解form controller is here的工作原理，请参阅其源代码）。
然后，您要告诉窗体该字段是有效还是无效：

$scope.myForm.$setValidity(fieldName, true, $scope.myForm);

或

$scope.myForm.$setValidity(fieldName, false, $scope.myForm);

我们还需要设置错误消息。首先使用$parse获取字段的访问器。然后从服务器分配值。

var serverMessage = $parse('myForm.'+fieldName+'.$error.serverMessage');
serverMessage.assign($scope, serverResponse[fieldName]);

我有一个与Derek类似的解决方案，在codetunes blog.TL中描述过; DR：

• 显示错误的方式与Derek的解决方案类似：

<span ng-show="myForm.fieldName.$error.server">{{errors.fieldName}}</span>

• add指令，当用户更改输入时，该指令将清 debugging 误：

<input type="text" name="fieldName" ng-model="model.fieldName" server-error />

angular.module('app').directive 'serverError', ->
  {
    restrict: 'A'
    require: '?ngModel'
    link: (scope, element, attrs, ctrl) ->
      element.on 'change', ->
        scope.$apply ->
          ctrl.$setValidity('server', true)
  }

• 通过将错误消息传递给作用域并告知窗体有错误来处理错误：

errorCallback = (result) ->
  # server will return something like:
  # { errors: { name: ["Must be unique"] } }
  angular.forEach result.data.errors, (errors, field) ->
    # tell the form that field is invalid
    $scope.form[field].$setValidity('server', false)
    # keep the error messages from the server
    $scope.errors[field] = errors.join(', ')

希望对大家有用：）

好吧，德里克·艾金斯给出的答案是非常好的工作。但是：如果你用ng-disabled="myForm.$invalid"禁用了提交按钮-该按钮不会自动恢复为启用状态，因为基于服务器的错误状态似乎没有改变。即使你再次编辑表单中的所有字段以符合有效输入（基于客户端验证）。

默认情况下，表单是正常提交的，如果你没有为表单中的每个字段提供name属性，那么它就不会提交正确的数据，你可以做的是在表单提交之前捕获它，然后自己通过 AJAX 提交数据。

<form ng-submit="onSubmit(); return false">

然后在$scope.onSubmit()函数中：

$scope.onSubmit = function() {
  var data = {
    'name' : $scope.item.name
  };
  $http.post(url, data)
    .success(function() {
    })
    .failure(function() {

    });
};

还可以通过设置所需属性来验证数据。

如果您选择ngResource，它将如下所示

var Item = $resource('/items/');
$scope.item = new Item();
$scope.submit = function(){
  $scope.item.$save(
    function(data) {
        //Yahooooo :)
    }, function(response) {
        //oh noooo :(
        //I'm not sure, but your custom json Response should be stick in response.data, just inspect the response object 
    }
  );
};

最重要的是，您的HTTP响应代码必须是4xx才能进入失败回调。

从2014年7月开始，AngularJS 1.3增加了新的表单验证特性，包括ngMessages和asyncValidators，这样你就可以在提交表单之前对每个字段进行服务器端验证。

Angular 1.3表单验证教程：

• Taming forms in Angular 1.3
• Video| Repo| Demo
  参考资料：
• ngMessages directive
• ngModel.NgModelController