I have a validation custom form, I use validate-message-character="{{compose.limitCharacter - compose.message.length}}" in a select and textarea like this
<form class="form-horizontal" role="form" name="composeForm" >
<select ng-change="limitComposeCharacter()" ng-selected="compose.profile"
ng-model="compose.profile" ng-options="userId in profiles" name="profile"
validate-message-character="{{compose.limitCharacter - compose.message.length}}" required>
</select>
number Character: {{compose.limitCharacter - compose.message.length}}
<textarea class="form-control" ng-model="compose.message" name="message"
validate-message-character="{{compose.limitCharacter - compose.message.length}}"
required></textarea>
Form validity: {{composeForm.$valid}}
I have something like this:
This is my directive to check number Character is > 0
angular.module('App')
.directive('validateMessageCharacter', function () {
return {
require: 'ngModel',
link: function postLink(scope, element, attrs, c) {
scope.$watch(attrs.ngModel, function() {
console.log(attrs.validateMessageCharacter);
if(attrs.validateMessageCharacter < 0)
{
c.$setValidity('maxCharacter', false);
c.$invalid = true;
}else{
c.$setValidity('maxCharacter', true);
c.$invalid = false;
}
});
}
};
});
It doesn't work proply when change select without change the textarea some advice?
First, using an advice from the angular google group, I changed the scope.$watch to attr.$observe. Second, the reason it validated only after typing text is that the text area is a required field. Your code works here: http://plnkr.co/edit/YvsuLoHzX9eqb7FhDgXA?p=preview