Только для числового ввода, угловой IE11

Question

У меня есть поле ввода, которое принимает только цифры, однако это работает только в Chrome. Когда я пробую то же поле ввода в IE11, оно принимает все типы входов.

<input type="number"/>

Я тоже пытался без победы.

<input type="text" pattern="[0-9]*"/>

Любая работа вокруг этого? IE11 уверен, что-то волшебное.

Решил сам:

добавленной

<input type="text" (keypress)="isNumberKey($event)"/>

И тогда в моем компоненте:

  isNumberKey($event) {
    let charCode = ($event.which) ? $event.which : $event.keyCode;
    console.log('Char code is ---> ', charCode);
    if (charCode > 31 && (charCode < 48 || charCode > 57))
      return false;

    return true;
  }

Answer 1

Я решил аналогичную проблему, создав директиву, которая допускает ограничение как конкретного символа, так и только цифры.

appName.directive("limitTo", [function() {
return {
    restrict: "A",
    link: function(scope, elem, attrs) {
        var limit = parseInt(attrs.limitTo);
        angular.element(elem).on("keypress", function(e) {
            if (this.value.length == limit) {
                if(e.which != 8){
                    e.preventDefault();
                }
            }
            if((isNaN(String.fromCharCode(e.charCode)) || e.charCode === 32 || e.charCode === 69) && e.which != 8){
                e.preventDefault();
            }
        });
    }
}

Это позволит вам ограничить все, что не является числом (включая пробелы, 'e' и тире). Просто добавьте директиву limit-to с символьным ограничением или вообще без него.

<input type="number" limit-to="4">

Надеюсь, что это помогает, извините за поздний ответ года. Ура!

Answer 2

Вы были очень близки со своим вторым примером. Это бы сработало:

<input type="text" pattern="^[0-9]*$"/>