NgMinlength And NgMaxlength - Set length value dynamically not working

[kamalpatel125]

Hi,
I am using ng-maxlength validation directive to validate input value for max length. but I need to change the value dynamically based on some rules defined. Currently, It's setting up the value outside the maxLengthValidator function scope So it's setting value on compile time. Could you please allow to change the maxvalue length dynamically by moving var maxlength = int(attr.ngMaxlength); inside the function ? or may some other solution. ngMinlength has got the same issue

Also, It clears the invalid value from the input textbox, is it desired behaviour ? because i do not wish to clear the text box value even if it is not valid length.

// max length validator
if (attr.ngMaxlength) {
var maxlength = int(attr.ngMaxlength);
var maxLengthValidator = function(value) {
if (!ctrl.$isEmpty(value) && value.length > maxlength) {
ctrl.$setValidity('maxlength', false);
return undefined;
} else {
ctrl.$setValidity('maxlength', true);
return value;
}
};

ctrl.$parsers.push(maxLengthValidator);
ctrl.$formatters.push(maxLengthValidator);

}
}

Thanks
Kamal Patel.

[caitp]

Mmm.. the general pattern of Angular isn't to respond to actual changes to an attribute value, but rather to respond to changes to a bound value.

So we could do it that way, but I'm not sure it's the right thing to do (the goal seems to be in putting control of an application in the hands of script variables, rather than in the hands of the DOM itself).

Something like this might not be too bad:

if (attrs.ngMaxlength) {
  var maxlength;
  $scope.$watch(attrs.ngMaxlength, function(value) { maxlength = int(value); });
  var maxLengthValidator = function(value) {
    if (!ctrl.$isEmpty(value) && value.length > maxlength) {
      ctrl.$setValidity('maxlength', false);
      return undefined;
    } else {
      ctrl.$setValidity('maxlength', true);
      return value;
    }
  };
  ctrl.$parsers.push(maxLengthValidator);
  ctrl.$formatters.push(maxLengthValidator);
}

This would take control of this operation out of the DOM, and if it's a constant value, $watch will remove the $watcher afters its first evaluation (so that's a good thing).

But it still might be too complicated and kind of sucky, mmm?

[kamalpatel125]

Thanks for your prompt reply.
Actually, We could do the way you suggesting but I do not want to touch the angular.js file so i am thinking to write my own directive which is almost same as ngMaxlength apart from one line "var maxlength = int(attr.ngMaxlength);". which I will move within validator function. So Everytime validator function get called, set the attribute value and also return value rather than 'undefined' value which doesn't clear textbox value on invalid state.

if (attrs.xuMaxlength) {
var maxlength;
var maxLengthValidator = function(value) {
var maxlength = int(attr.xuMaxlength);
if (!ctrl.$isEmpty(value) && value.length > maxlength) {
ctrl.$setValidity('maxlength', false);
return value;
} else {
ctrl.$setValidity('maxlength', true);
return value;
}
};
ctrl.$parsers.push(maxLengthValidator);
ctrl.$formatters.push(maxLengthValidator);
}

but still i wonder if angular would support this natively then i don't need to write my own directives for these validators.

Thanks again for your reply !

Thanks & Regards,

Kamal Patel.

[caitp]

Well, I can submit a patch for it, but I can't guarantee that it would get merged... probably a custom directive for this would be the way to go

[kamalpatel125]

Great ! thanks

[caitp]

I think if a patch for this is going to be attempted, it will probably wait for #5346 to be merged, and not attempted if it is rejected, simply because that patch would provide the infrastructure to do it. SO it could be a while. Custom directive is probably the way to go for now.

[kamalpatel125]

Hi,

Thanks again for your support ! Sure, I have written custom directive for now and it is working fine so let's hope for patch to be applied.

Regards,

Kamal Patel.

[IgorMinar]

this is very similar to #5226 if we implement that one, we should implement this one in the same way.

[Narretz]

Fixed since 1.3.0-beta.12