Attribut Direktive Zugriffselement und Hinzufügen eines Listners

Question

Ich muss eine Attributrichtlinie schreiben mit Angular 1.5.5, die im Wesentlichen Eingaben bei Tastendruckereignis des Textfelds einschränkt. So sollte es so aussehen

<input type="number" name="age" id="age" restrict-char="['e','-']" /> 

Wie können wir ein Attribut Richtlinie ohne Link-Funktion schreiben. Ich möchte nicht Linkfunktion verwenden, da ich meine Code-Basis zu Angular 2.0 portieren werde und Verbindungsfunktionen dort nicht unterstützt werden.

Answer 1

Nicht sicher, ob das ist, was Sie wollen, aber Sie können $ Parser für ngModelController verwenden und ng-model-options für die Aktualisierung bei jedem Ereignis einstellen.

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

 
angular.module('app').directive('restrictChar',() => { 
 
    return { 
 
    restrict: 'A', 
 
    require: 'ngModel', 
 
    scope: { 
 
     restricted: '=restrictChar' 
 
    }, 
 
    controller: function ($scope, $element) { 
 
     const ngModel = $element.controller('ngModel'); 
 
    
 
     ngModel.$parsers.unshift((value) => { 
 
     const newVal = value 
 
      .split('') 
 
      .filter((char) => $scope.restricted.indexOf(char) === -1) 
 
      .join(''); 
 
     
 
     $element.val(newVal); 
 
     
 
     
 
     return newVal; 
 
     }); 
 
    } 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script> 
 
<div ng-app="app"> 
 
    <input type="text" ng-model="x" name="age" id="age" restrict-char="['e','-']" ng-model-options="{updateOn: 'keyup'}" /><br> 
 
    {{x}} 
 
</div>