Регулярное выражение, которое проверяет динамические приращения полей ввода (angularJs)?

Question

Мне нужно проверить вход пользователя в поле ввода (номер типа) с помощью регулярного выражения.

Я reveice следующие динамические значения:

• минимум: Я уже проверки того, что с угловой максимальной
• : Я уже проверки того, что с угловой
• приращением: < - моя проблема

Пример: минимум: 10; максимум: 100; Приращение: 10

Разрешено пользовательский ввод с динамическим приращению 10 должна быть:

10 - 20 - 30 - 40 - 50 - 60 - 70 - 80 - 90 - 100

Другие примеры:

• минимум: 0; максимум: 2000; приращение: 100
• минимум: 1; максимум: 3,4; increment: 0.2

Я пробовал несколько выражений регулярных выражений, но даже один из них не работал с динамическими значениями (разная длина номера/десятичная). Может быть, проще иметь один с числами и один для чисел с десятичной точкой.

Благодарим за помощь!

Answer 1

Используйте input тег с соответствующими атрибутами. HTML5 предоставляет вам step attribute.

<input type="number" min=10 max=100 step=10 /> 
 
<input type="number" min=0 max=2000 step=100 /> 
 
<input type="number" min=0 max=3.4 step=0.2 />

Answer 2

Быстрый ответ на Ваш вопрос (так как вы сказали, угловатые, я предполагаю, что вам это нужно для JS):

function tenToHundred(num){ 
    return /^[1-9]{1}0{1}$|^100$/.test(num); 
} 
for(var i=1;i<=11;i++)console.log(tenToHundred(i*10));//10 ~ 100 test 

Предложение о тех рода проверок (на основании вашего примеры), REGEX как инструмент для строковых шаблонов проверяет \ совпадения и т. д. Он менее подходит для числовых вычислений, поэтому, возможно, вам следует рассмотреть другие методы проверки. , например - с помощью оператора remainder

function tenToHundred(num){ 
    var min=10, max=100, increment=10;//when need to maintain - just change those 
    return num>=min && num<=max && num%increment==0; 
} 
for(var i=1;i<=10;i++)console.log(tenToHundred(i*10));//10 ~ 100 tests 

Таким образом, будет легче поддерживать ваш код.

Answer 3

Вы правы. Теперь я устанавливаю значение шага как hjpotter92 и добавляю некоторую логику, о которой упомянул Никита Куртин. Угловая не в состоянии проверить шаг из коробки ..

<input type="number" step="10" validate-step /> 

Тогда я написал парсер:

angular 
    .module('....validateStep', []) 
    .directive('validateStep', ValidateStepDirective); 

/** 
* @namespace ValidateStepDirective 
* @example <validate-step></validate-step> 
* @memberOf Directives 
*/ 
function ValidateStepDirective(){ 
    return { 
     require: 'ngModel', 
     link: ValidateStepDirectiveController 
    }; 
} 

function ValidateStepDirectiveController(scope, element, attrs, ctrl){ 
    var step; 
    if(attrs.step) { 
     step = parseFloat(attrs.step); 
    } 

    function isValidStep(value, step) { 
     var checkValue = value * 100; 
     // fixing js multiplication issue (2.3*100=229.999999) 
     checkValue = checkValue.toFixed(0); 
     var checkStep = step * 100; 
     return checkValue%checkStep === 0; 
    } 

    function stepValidator(viewValue){ 
     if(step && isValidStep(viewValue, step)){ 
      ctrl.$setValidity('step', true); 
      return viewValue; 
     }else{ 
      ctrl.$setValidity('step', false); 
      // if invalid, return undefined 
      // (no model update happens) 
      return; 
     } 
    } 

    ctrl.$parsers.unshift(stepValidator); 
} 

Я надеюсь, что смогу помочь другим с моим решением.