Prevent literę „e” i kropki przed wpisany numer wejściowego

Question

Mam prosty numer wejścia tak:

<input type="number"/> 

Gdy próbuje niczego wejściowego innego niż numer lub literę „E”, to nie działa, ale kiedy wpisuję literę "e" to działa.

Sprawdziłem specyfikację w3.org i wyraźnie stwierdza, że ​​liczby zmiennoprzecinkowe można wpisywać za pomocą normalnej notacji (np. 10.2) lub notacji naukowej (np. 1e2).

Moje pytanie brzmi: czy istnieje sposób, aby uniemożliwić użytkownikowi pisanie liter i kropek. Mówi się w inny sposób: czy istnieje sposób, aby numer wejściowy zaakceptować TYLKO LICZNE INTEGRATORY?

Mam pomysł zrobienia tego za pomocą dyrektywy Angular, którą wprowadzę jako atrybut do mojego numeru wejściowego, ale naprawdę nie wiem, jak wykonać tę pracę.

EDIT: Co chciałbym zrobić, to symulować ten sam zachowanie, że mamy teraz, gdy próbuje wpisać dowolną inną literą alfabetu innego niż „e” lub „”. Chcę tylko powiedzieć, że nie chcę widzieć litery pojawiającej się na wejściu (tak jak teraz jest).

Answer 1

Masz rację, że należy to zrobić z dyrektywą. Wystarczy utworzyć dyrektywę i dołączyć ją do input. Ta dyrektywa powinna wykrywać zdarzenia keypress i/lub keydown. Możliwe również wklejanie wydarzeń. Jeśli wprowadzony znak char jest "e" lub dot-call event.preventDefault();

angular.module('app', []) 
 
    .directive('yrInteger', yrInteger); 
 

 
function yrInteger() { 
 
    return { 
 
    restrict: 'A', 
 
    link: function(scope, element, attrs) { 
 
    
 
     element.on('keypress', function(event) { 
 

 
     if (!isIntegerChar()) 
 
      event.preventDefault(); 
 
     
 
     function isIntegerChar() { 
 
      return /[0-9]|-/.test(
 
      String.fromCharCode(event.which)) 
 
     } 
 

 
     })  
 
    
 
    } 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <input 
 
     type="number" 
 
     yr-integer 
 
     /> 
 
</div>

Answer 2

można po prostu użyć ng-pattern na wejściu

Controller

$scope.onlyDigits= /^\d+$/; 

HTML

<input ng-pattern="onlyDigits" type="number" /> 

Takie wykorzystanie wzoru \d co jest dla każdej wartości liczbowej