Текстовое поле только с цифрами

Question

Я вижу все, что рекомендуется для текстового поля, содержащего только цифры:

 <input  formControlName="imo" class="form-control" pattern="\d*" maxlength="8">

Но я могу вводить символы и не ограничиваться только цифрами.Я использую последнюю версию Crome.Является ли это побочным эффектом formControlName в моем приложении Angular или я неправильно понял часть шаблона?

Answer 1

Я думаю, это то, что вы ищете:

<input type="number" formControlName="imo" class="form-control" min="1" max="5">

Answer 2

pattern просто проверяет, является ли значение допустимым или нет, оно не влияет на то, что печатает пользователь.Если вы хотите разрешить только числовые значения, а введенные цифры не превышают 5 (как вы говорите в комментарии), то вы можете сделать это:

<input type="text" formControlName="imo" (keypress)="checkValue($event)">

и функцию:

checkValue(event) {
  return event.target.value.length === 5 ? event.preventDefault() : 
    String.fromCharCode(event.charCode).match(/[^0-9]/g) === null
}

StackBlitz

Это фактически заблокирует вход.Если это подходит для неблокирующих значений, вы можете использовать Validators.pattern(), а затем просто показывать сообщение об ошибке, когда пользователь вводит что-то, чего не следует.

Answer 3

Здравствуйте, вы пробовали это ниже

\ d + вместо \ d *