угловая директива была вызвана только один раз

0

Я использую директиву для создания пользовательского валидатора, и он работает нормально. Но это было вызвано только один раз! Если мои "roleItems" обновляются, эта директива не была вызвана снова! Как это можно вызвать каждый раз, когда обновляются "roleItems"?

Вот наценки. И "Не-пустой" - моя директива.

 <form name="projectEditor">    
    <ul name="roles" ng-model="project.roleItems" not-empty>
        <li ng-repeat="role in project.roleItems"><span>{{role.label}}</span> </li>
       <span ng-show="projectEditor.roles.$error.notEmpty">At least one role!</span>
      </ul>
    </form>

Это моя директива. Он должен проверить, являются ли ng-model "roleItems" пустыми.

angular.module("myApp", []).
    directive('notEmpty', function () {
        return {
            require: 'ngModel',
            link: function (scope, elm, attrs, ctrl) {

                ctrl.$validators.notEmpty = function (modelValue, viewValue) {


                    if(!modelValue.length){
                        return false;
                    }

                    return true;
                };

            }
        };
    });
Теги:
angularjs-directive

1 ответ

0
Лучший ответ

Основная цель валидатора - проверить значение ngModel ввода пользователя или изменения модели, поэтому оно должно быть использовано для checkbox/textara/input и т.д. Вы не можете проверить ng-модель всего. Угловая достаточно умная, чтобы знать, что ng-модель не имеет никакого чувства, поэтому он просто игнорирует ее.

Я хочу изменить только сообщение об ошибке, которое вы можете проверить через свойство.length. Если вы хотите сделать всю форму недействительной, я предлагаю вам создать настраиваемую директиву, надеть ее, а затем в валидатор этой контрольной проверки scope.number.length> 0

В основном просто отредактируйте свой директивный код для ввода элемента и спрячьте его.... через css или type = hidden, но не делайте ngModel = "значение", это не имеет смысла, потому что ng-модель ожидает значения, которое может быть привязано и перезаписано, но проект.roleItems не связывается! поэтому поместите ng-model = "dummyModel" и фактические элементы в другой параметр...

<input type="hidden" ng-model="dummyIgnoredModel" number="project.roleItems" check-empty>


angular.module("myApp", []).
    directive('checkEmpty', function () {
        return {
            require: 'ngModel',
            link: function (scope, elm, attrs, ctrl) {

                ctrl.$validators.push(function (modelValue, viewValue) {


                    if(!scope.number.length){
                        return false;
                    }

                    return true;
                });
             //now we must "touch" ngModel
               scope.$watch(function()
               {
                  return scope.number
               }, function()
               {
                  ctrl.$setViewValue(scope.number.length);
               });
            }
        };
    });

Ещё вопросы

Сообщество Overcoder
Наверх
Меню