Question

对于我正在进行的项目，我有一个非常简单的对话框，可以将自定义员工添加到业务应用程序中。模态本身并不特别 - 名字，姓氏，确定，取消。容易，对吧？

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

(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和{{1}的输入进行了相同的验证属性！

Answer 1

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

角度形式验证的工作方式是它将范围内的东西粘在一起。范围内的问题包括controllerAs别名，还有form对象。假设我已将表单命名为employeeModal，这意味着我可以通过调用link(scope)从scope.employeeForm函数访问它。

表单具有添加它们的每个命名输入的属性（例如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.
    };
}

异步多字段验证在状态之前运行＆＃39;我要验证的是什么

1 个答案: