Question

我在表单上使用angular-bootstrap-ui-dropdown。我想对这个元素进行一些验证。是否可以使用Angular Validator？

代码目前看起来如下，所有这些都在表单元素中，我设法验证其他标准表单元素（例如输入等）

<div class="btn-group" uib-keyboard-nav uib-dropdown>
    <button id="salutation-button" type="button" class="btn btn-primary" uib-dropdown-toggle>
        <span class="dp-caption">{{passenger.salutation || 'Salutation'}}</span> <span
            class="fa fa-angle-down"></span>
    </button>
    <ul class="uib-dropdown-menu" role="menu" aria-labelledby="single-button">
        <li ng-repeat="salutation in salutationList" ng-click="setSalutation(salutation)"
            role="menuitem"><a href="#">{{salutation}}</a></li>
    </ul>
</div>

是否可以验证此下拉列表中是否选择了值？

Answer 1

您可以添加$validators to the ngModelController（假设您使用的是ngModel）。例如，在您的指令中，您可以要求它并添加您想要的验证器：

变量，带有一个简单的允许名称列表：

var allowedNames = [...array with names...]

......这可能是指令的一部分：

    ...
    require: '?ngModel',
    link: function (scope, iElement, iAttribute, ngModel) {
        var $validators = { // object with one or more validators
            isNameAllowed: function (modelValue, viewValue) {
                var value = modelValue || viewValue;

                if (!value || allowedNames.indexOf(value) > -1) {
                    return true;
                } else {
                    return false;
                }
            }
        };

        ngModel.$validators = angular.extend({}, ngModel.$validators, $validators);
        ...
    }
    ...

在这个例子中，我添加了一个名为“isNameAllowed”的简单验证器，它检查模型中的值是否在允许的名称列表中。

如何验证Angular中的非表单元素？

1 个答案: