Я использую директиву для создания пользовательского валидатора, и он работает нормально. Но это было вызвано только один раз! Если мои "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;
};
}
};
});
Основная цель валидатора - проверить значение 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);
});
}
};
});