If you can supported maximum value validation?

[SumailXu]

Well,this is a good angular directive. I need validation input value's maximum value, my custom directive like this:

ctrl.$validators.max = function(modelValue, viewValue){
var val = modelValue || viewValue;
   if(ctrl.$isEmpty(val) || !max || !numberPattern.test(val)){
     return undefined;
   }
   return val <= max;
};

It works well,when validation fails,and exceed max length(It is set up by numInt attributes). input value will become '0'.

Finally,I can't used my custom directive to validation maximum value,can you provide a attribute to set up maximum value?

[schinken]

And also a minimum value would be very nice, too

[uhlryk]

Implementation doesn't look too hard. But I have objection how it should work. For example you set min value to 1234,12345. Now user want to type value 99. To do this he type first number 9. Directive doesn't know when value is typed, it just checks actual value. Therefore it checks if value 9 is bigger then min value. And it isn't. What then? Less problematic is max value but I also see UX problems.

[surfjedi]

Min and max would be great

[felipe-vargas-inrae]

can somebody solve it?

[WuglyakBolgoink]

any news?

[gjeanmart]

I've built a directive that works for me . If it can help someone ...

Javascript

app.directive('minMaxValidator', function() {
    return {
        restrict: 'A',
        require: '^form',
        link: function($scope, element, attrs, ctrl) {
            var validatorMin = function (ngModelValue) {
                if(!attrs.min || attrs.min === null || attrs.min === undefined || isNaN(attrs.min)) {
                    return true;
                }
                if(ngModelValue === undefined || ngModelValue===null || ngModelValue==="") {
                    return true;
                }

                if (!isNaN(ngModelValue)) {
                    var value = parseInt(ngModelValue);
                    var min = parseInt(attrs.min);
                    return (value >= min);
                } else {
                    return false;
                }
            };

            var validatorMax = function (ngModelValue) {
                if(!attrs.max || attrs.max === null || attrs.max === undefined || isNaN(attrs.max)) {
                    return true;
                }
                if(ngModelValue===undefined || ngModelValue===null || ngModelValue==="") {
                    return true;
                }

                if (!isNaN(ngModelValue)) {
                    var value = parseInt(ngModelValue);
                    var max = parseInt(attrs.max);
                    return (value <= max);
                } else {
                    return false;
                }
            };
            ctrl[attrs.name].$validators['minValidator'] = validatorMin;
            ctrl[attrs.name].$validators['maxValidator'] = validatorMax;
        }
      };
});

HTML

<div class="form-group col-sm-6 col-md-6 col-lg-6" show-errors >
    <label class="control-label">Term</label>
    <input  type="text" 
            class="form-control" 
            name="term" 
            ng-model="term"
            awnum="uint"
            min-max-validator
            ng-min="termMin"
            ng-max="termMax">
    <div class="validation help-block">
        <span ng-if="form.term.$error.minValidator || form.term.$error.maxValidator>
            This field must be between {{termMin}} & {{termMax}}
        </span>
    </div>
</div>

That give a result like that

[schinken]

What das "show-errors" do?

[gjeanmart]

That's a nice Angular plugin to show form error validation: https://github.com/paulyoder/angular-bootstrap-show-errors. Basically, it's just manipulate CSS classes if a field has an $error

[zesda]

Bear in mind that @gjeanmart's solution will only work for integers due to the parseInt within the validators, stumped me for a good while :)