AngularJS - проверять, когда значение ng-модели отсутствует в параметрах выбора

У меня есть ситуация, когда значение ng-модели иногда может отсутствовать в списке ng-options раскрывающегося списка Select (например, идентификатор пользователя, которого нет в компании, сохраненной в записи). Поведение AngularJS заключается в том, что он добавляет пустую опцию к раскрывающемуся списку, но не помечает его как недействительный или ошибочный, что затрудняет проверку. Я нашел здесь решение, которое использует директиву для обработки этой ситуации при загрузке страницы. Поскольку я получил идентификатор пользователя и список с помощью вызова API, после исследования я добавил $watch, чтобы убедиться, что данные были загружены перед проверкой, но я не могу заставить его работать. Может ли кто-нибудь помочь мне понять, что не так с моим кодом? Кажется, код внутри функции $validators не вызывается должным образом или постоянно. Мне нужно показать сообщение, когда идентификатор пользователя отсутствует в списке выбора, но когда пользователь выбирает имя из выпадающего списка, сообщение должно исчезнуть.

Вот соответствующая часть моего кода:

<div ng-app="RfiApp" ng-controller="RfiControllerRef" class="col-sm-12">
<form class="pure-form pure-form-aligned" name="frm" method="post"
      autocomplete="off">

    <div class="form-horizontal">

        <div class="form-group">
            <label class="control-label col-md-2" for="bsa_analyst_user_id">BSA Analyst</label>
            <div class="col-md-10">
                <select class="form-control" id="bsa_analyst_user_id" name="bsa_analyst_user_id" ng-model="rfi.bsa_analyst_user_id" ng-options="s.value as s.name for s in BsaAnalysts | orderBy: 'name'" valid-values="BsaAnalysts" required>
                    <option value="">--Select--</option>
                </select>{{frm.bsa_analyst_user_id.$error}} - {{frm.bsa_analyst_user_id.$invalid}} - {{rfi.bsa_analyst_user_id}}
                <div class="text-danger"
                     ng-show="frm.bsa_analyst_user_id.$invalid"
                     ng-messages="frm.bsa_analyst_user_id.$error">
                    <div ng-message="required">BSA Analyst is required</div>
                    <div ng-message="validValues">BSA Analyst in database not valid or not in BSA Unit selected</div>
                </div>
            </div>
        </div>
    </div>
</form>
</div>

Код.JS:

RfiApp.directive('validValues', function () {
    return {
        scope: {
            validValues: '=',
            model: '=ngModel'
        },
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attributes, ngModel) {
            scope.$watch('[model,validValues]', function (newVals) {
                if (newVals[0] && newVals[1]) {
                    var values = angular.isArray(scope.validValues)
                        ? scope.validValues
                        : Object.keys(scope.validValues);
                    ngModel.$$runValidators(newVals[0], values, function () { });
                    ngModel.$validators.validValues = function (modelValue) {
                        var result = values.filter(function (obj) {
                            return obj.value == modelValue;
                        });
                        var ret = result.length > 0;
                        return ret;
                    }
                }
            });
        }
    }
});


$scope.GetDropdownValues = function () {
    var a = 1;
    DropdownOptions.get(
        function (response) {
    //... other code ommitted
            $scope.UserAnalysts = response.UserAnalystsList;
        },
        function () {
            showMessage('error', "Error");
        }
    );
};


$scope.GetExistingRfi = function () {
    NewRfiResource.get({ rfiId: $scope.rfiId },
        function (response) {
            $scope.rfi = response.rfi;
            $scope.ButtonText = "Save";
        },
        function (response) {
            showMessage('error', response.data.Message);
            $scope.GetNewRfi();
        }
    );
};

$scope.GetDropdownValues();
if ($scope.rfiId != "0") {
    $scope.GetExistingRfi();
}
else {
    $scope.GetNewRfi();
}

Спасибо!

0 ответов

Другие вопросы по тегам