2016-07-19 5 views
0

Ich habe einen Eingang, der Typ = "Nummer" ist. Ich möchte verhindern, dass der Benutzer Dezimalzahlen, Addition, Subtraktion oder e in die Eingabe eingibt. Momentan versuche ich e.preventDefault() auf ng-keypress um den Schlüssel komplett zu deaktivieren. Aber es funktioniert nicht. Ich benutze typescript und angularJs. Das Ereignis wird zwar auf Tastendruck angezeigt, verhindert jedoch nicht, dass der Eintrag erstellt wird. Oder wäre die Verwendung von ng-pattern mit einer Regex eine alternative Option, die Eingabe auf 0-9 beschränkt?Ng-Tastendruck verhindern Standard für bestimmte charCode

setCapacityType(e) { 
 
    let keyCode = (e.keyCode ? e.keyCode : e.which); 
 
    
 
    if (keyCode < 48 && keyCode > 57) { 
 
    e.preventDefault(); 
 
    console.log("xx"); 
 
    } 
 
}
<input type="number" ng-keydown="vm.setCapacityType($event)" 
 
autocomplete="off" autocorrect="off" spellcheck="false">

Antwort

2

Nun, zwei Dinge:

  1. Zuerst müssen Sie Ihre Funktion instanziiert:
vm.setCapacityType = function(e) { 
    Um
  1. erlaubt nur Zahlen [0-9] Sie Ihren Zustand, wie unten schreiben sollte:
if (keyCode < 48 || keyCode > 57) { 

Jetzt können Sie so etwas wie dieses:

angular.module('app', []) 
 
    .controller('mainCtrl', function() { 
 
    var vm = this; 
 

 
    vm.setCapacityType = function(e) { 
 
     let keyCode = (e.keyCode ? e.keyCode : e.which); 
 
     if (keyCode < 48 || keyCode > 57) { 
 
     console.log("Prevent!"); 
 
     e.preventDefault(); 
 
     } 
 
    } 
 
    });
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl as main"> 
 
    <input type="text" ng-keydown="main.setCapacityType($event)" autocomplete="off" autocorrect="off" spellcheck="false"> 
 
</body> 
 

 
</html>

ng-Muster mit einer Regex ist eine Alternative opt Ioneneingabe auf 0-9 beschränken?

Nein, ngPattern Direktive verhindert/beschränkt nicht die Eingabe.

Verwandte Themen