Question

我有以下指令，我用于多选的验证，以允许（动态）长度验证所选项目的数量。

(function() {
    'use strict';

    angular
        .module('myModule')
        .directive('listLength', listLength);

    listLength.$inject = ['$parse'];

    function listLength($parse) {
        var directive = {
            require: 'ngModel',
            restrict: 'A',
            link: link
        };

        function link(scope, elem, attr, ngModel) {
            var length = 0;
            var exp = $parse(attr.listLength);
            if (exp.constant) {
                // Single value, no need to watch
                length = exp(scope);
            } else {
                // We have an expression, need to watch for changes
                scope.$watch(attr.listLength, function(newVal, oldVal) {
                    length = newVal;
                });
            }

            //For DOM -> model validation
            ngModel.$parsers.unshift(function(value) {
                if (!angular.isUndefined(value) && value !== "") {
                    var valid = value.length === length;
                    ngModel.$setValidity('listLength', valid);
                    return valid ? value : undefined;
                }
                return value;
            });

            //For model -> DOM validation
            ngModel.$formatters.unshift(function(value) {
                if (!angular.isUndefined(value) && value !== "") {
                    var valid = value.length === length;
                    ngModel.$setValidity('listLength', valid);
                }
                return value;
            });
        }

        return directive;
    }
})();

为了让它正确更新，我需要在表达式（attr.listLength）更新时触发验证，但对我来说如何实现这一点并不明显。我尝试将ngModel.$dirty设置为true，但仍然无法更新。

Answer 1

尝试更改watch参数：

scope.$watch("listLength", function(newVal, oldVal) {
       length = newVal;
});

Answer 2

看起来在Angular 1.2中执行此操作的唯一方法是使用ngModel.$setViewValue，它会触发所有验证功能。所以如果我这样做

scope.$watch(attr.listLength, function(newVal, oldVal) {
    length = newVal;
    ngModel.$setViewValue(ngModel.$viewValue);  // Set view value to itself...
});

然后触发验证功能。在angularjs 1.3+中，可以使用ngModel。$ validate（）

完成

angularjs 1.2 - $ watch上的验证指令更新

2 个答案: