Angularjs表单验证现有值不起作用

时间:2016-12-02 06:44:40

标签: javascript angularjs forms validation angularjs-directive

我有问题理解为什么检查表单验证的指令不起作用。

我的表单定义:

<body ng-controller="MainCtrl">
    <form name="myForm">
        <input type="text" 
            name="groupName" 
            ng-model="group[0].name"  
            groupname="group[0].name"
            ng-minlength="1" 
            ng-required="true"
            ng-model-options="{ updateOn: 'blur' }" />
        <div ng-if="myForm.groupName.$pending.credentialNameExists">checking....</div>
        <div ng-if="myForm.groupName.$error.credentialNameExists">group name exists already</div>
    </form>
</body>

我的angularjs控制器:

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.group = [
    {
      name: 'Group1'
    }  
  ];
});

表单验证指令:

app.directive('credentialNameDirective', function(modalService,$timeout,$q){
    return {
        restrict: 'AE',
        require: "ngModel",
        scope: {
            otherModelValue: "=groupname"
        },
        link: function(scope, elm, attr, ctrl) {
            ctrl.$asyncValidators.credentialNameExists = function(modelValue, viewValue) {
                if (ctrl.$isEmpty(modelValue)) {
                    // consider empty model valid
                    return $q.when();
                }

                var def = $q.defer();
                if ((scope.otherModelValue !== undefined &&
                      scope.otherModelValue === modelValue ) ) {
                    def.resolve();
                    return def.promise;
                }

                def.reject();
                return def.promise;
            };
        }
    }
});

我需要通过$ scope.group [i] .name提供表单的模型数据。 在onblur操作后,通过指令验证不会触发。如何实现该事件将触发指令?

有什么方法可以让我的工作吗?

我用我的问题准备了plunker示例:Plunker example

由于

0 个答案:

没有答案