对我要验证的状态 'just before' 运行的异步多字段验证

Question

对于我正在处理的项目，我有一个非常简单的对话框，用于将自定义员工添加到业务应用程序。模态框本身没什么特别的——名字、姓氏、确定、取消。容易...对吗？

然而，其中一项业务规则是我们不允许提交重复的员工。为此，我实施了以下 angular 指令：

(function() {
    'use strict';

    angular.module('app').directive('checkDuplicateEmployee', ['$q', 'officesSvc', 'webDataSvc', directive]);

    function directive($q, officesSvc, webDataSvc) {
        return {
            restrict: 'A',
            require: 'ngModel',
            link: function(scope, elem, attrs, vm) {
                vm.$asyncValidators.duplicateEmployee = function (modelValue, viewValue) {
                    // Problem visible here!
                    var args = {
                        officeType: officesSvc.officeType,
                        officeName: officesSvc.selectedOffice.name,
                        firstName: scope.vm.firstName,
                        lastName: scope.vm.lastName
                    };

                    // Custom wrapper for $http.
                    return webDataSvc.get('/api/admin/DoesEmployeeExist', args)
                        .then(function(results) {
                            if (results === true)
                                deferred.reject(results);

                                return true;
                            });
                };
            }
        }
    }
})();

我遇到的问题是，当我将指令添加到输入时...

<input type="text" id="firstName" name="firstName"
       maxlength="35"
       ng-model="vm.firstName"
       required check-duplicate-employee />

我输入了一些东西，发送到服务器的状态是紧接我的按键之前的状态。

Field:      | vm.firstName:      
----------------------------
T           |
Te          | T
Tes         | Te
Test        | Tes

因此，我可以由此推断范围不会更新，直到在验证运行之后。

问题：如何在$scope.vm对象更新后进行异步验证？请记住，我不能只将 viewValue 传递给 args 列表中的 firstName 属性 - 我对 vm.firstName 和 vm.lastName属性！

Answer 1

幸运的是，是获取视图值的方法！

angular 表单验证的工作方式是将内容粘贴在范围内。卡在范围内的东西包括 controllerAs 别名，还有 form 对象。假设我已将表单命名为 employeeModal，这意味着我可以通过调用 scope.employeeForm.

从 link(scope) 函数访问它

表单具有添加的每个命名输入的属性（例如 scope.employeeForm.firstName）。而且，它们有一个 $viewValue 属性可以让您与视图值进行交互。

因此，需要对指令进行一些细微的修改。具体来说，需要 A) 找到表单对象的名称，然后 B) 将范围向下抓取到所需元素的 $viewValue，并将其添加到远程验证的参数中。

link: function(scope, elem, attrs, vm) {
    var formName = $(elme).parents('form').attr('name');

    vm.$asyncValidators.duplicateEmployee = function () {
        var args = {
            officeType: officesSvc.officeType,
            officeName: officesSvc.officeName,
            firstName: scope[formName].firstName.$viewValue,
            lastName: scope[formName].lastName.$viewValue
        };

        // Make remote validation call.
    };
}

对我要验证的状态 'just before' 运行的异步多字段验证

Asynchronous Multifield Validation operating on a state 'just before' what I want to validate

javascript

validation

asynchronous

remote-validation

angularjs