文本输入仅允许在angularjs中使用整数输入 [英] Text Input allow only Integer input in angularjs

问题描述

我想将html输入[number] <input type="number" />设置为仅允许整数输入(不能浮动).

I want to set the html input[number] <input type="number" /> to allow only integer input (not float).

基本上，html input [number]允许'.输入浮点输入，我不想要.

Basically, the html input[number] allow '.' to be entered for float input and I don't want that.

在AngularJS中有一种快速的方法来实现它吗?

Is there a quick way to accomplish it in AngularJS?

推荐答案

这是如何实现的.

1. 使用输入类型-'文本'

1. With input type - 'text'

指令:

app.directive('onlyNumbers', function () {
    return  {
        restrict: 'A',
        link: function (scope, elm, attrs, ctrl) {
            elm.on('keydown', function (event) {
                if(event.shiftKey){event.preventDefault(); return false;}
                //console.log(event.which);
                if ([8, 13, 27, 37, 38, 39, 40].indexOf(event.which) > -1) {
                    // backspace, enter, escape, arrows
                    return true;
                } else if (event.which >= 48 && event.which <= 57) {
                    // numbers 0 to 9
                    return true;
                } else if (event.which >= 96 && event.which <= 105) {
                    // numpad number
                    return true;
                } 
                // else if ([110, 190].indexOf(event.which) > -1) {
                //     // dot and numpad dot
                //     return true;
                // }
                else {
                    event.preventDefault();
                    return false;
                }
            });
        }
    }
});

HTML:

<input type="text" only-numbers>

使用输入类型-'数字'

With input type - 'number'

指令:

app.directive('noFloat', function () {
return  {
    restrict: 'A',
    link: function (scope, elm, attrs, ctrl) {
        elm.on('keydown', function (event) {
          if ([110, 190].indexOf(event.which) > -1) {
                // dot and numpad dot
                event.preventDefault();
                return false;
            }
            else{
              return true;
            }
        });
    }
}
});

HTML: <input type="number" step="1" no-float>

查看柱塞

这篇关于文本输入仅允许在angularjs中使用整数输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！