javascript - inputtype=number validering i angularjs

Jeg forsøger at validere < input type=number > ved at bruge input [number] direktivet fra modulet ng i AngularJS.

Når der bruges en inputtype af typen nummer, med max- (eller min-) attributten sat til et nummer såsom

<input type=number min="20" max="40">

det fungerer fint, men mine min- og max-data kommer dynamisk ved hjælp af ng-repeat, såsom

<input type=number min="configRow.valueStart" max="configRow.valueEnd">, så virker det ikke.

Jeg ved, at min og max kun accepterer tal, og jeg er ikke særlig god til at skrive direktiver for det. Vær venlig at hjælpe mig; enhver sådan guide eller forslag vil blive værdsat.

Svar #1

min og max forventer en værdi. Så dette skulle fungere:

<input type=number min="{{configRow.valueStart}}" max="{{configRow.valueEnd}}">

Her er en plunker, der viser en demo. (Dette er blot en ændring af dokumentationsdemoen).

I øjeblikket ser kilden til disse attributter ud som nedenfor. Så du kan se, at der forventes en værdi, som derefter konverteres til en float med parseFloat. Så interpolering af model-ejendommen {{}} til en værdi er nødvendig.

src/ng/directive/input.js

if (attr.min) {
        var minValidator = function(value) {
          var min = parseFloat(attr.min);
          return validate(ctrl, 'min', ctrl.$isEmpty(value) || value >= min, value);
        };

        ctrl.$parsers.push(minValidator);
        ctrl.$formatters.push(minValidator);
      }

      if (attr.max) {
        var maxValidator = function(value) {
          var max = parseFloat(attr.max);
          return validate(ctrl, 'max', ctrl.$isEmpty(value) || value <= max, value);
        };

        ctrl.$parsers.push(maxValidator);
        ctrl.$formatters.push(maxValidator);
      }

Svar #2

Max længde vil ikke fungere med <input type="number", den bedste måde jeg kender er at bruge oninput-hændelsen til at begrænse maxlength, det er en generisk løsning, der virker med alle Javascript-rammer. Se venligst koden nedenfor.

<input name="somename"
    oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
    type = "number"
    maxlength = "6"
 />T