Je crois que l'intention de AngularJS intrants et de l' ngModel direcive est que l'entrée non valide ne doit jamais se termine dans le modèle. Le modèle doit être toujours valide. Le problème avec le fait d'avoir modèle invalide est que nous puissions avoir des observateurs de l'incendie et de prendre (inapproprié) des actions fondées sur le modèle invalide.
À mes yeux, la bonne solution consiste à brancher sur l' $parsers pipeline et assurez-vous que l'entrée non valide n'est pas dans le modèle. Je ne suis pas sûr de savoir comment avez-vous essayer d'approche ou qu'est-ce exactement ne fonctionne pas pour vous, avec $parsers mais ici, c'est une directive simple qui permet de résoudre votre problème (ou au moins ma compréhension du problème):
app.directive('customValidation', function(){
return {
require: 'ngModel',
link: function(scope, element, attrs, modelCtrl) {
modelCtrl.$parsers.push(function (inputValue) {
var transformedInput = inputValue.toLowerCase().replace(/ /g, '');
if (transformedInput!=inputValue) {
modelCtrl.$setViewValue(transformedInput);
modelCtrl.$render();
}
return transformedInput;
});
}
};
});
Dès que la directive ci-dessus est déclarée, il peut être utilisé comme:
<input ng-model="sth" ng-trim="false" custom-validation>
Comme dans la solution proposée par @Valentyn Shybanov nous avons besoin d'utiliser l' ng-trim directive, si nous voulons interdire les espaces au début et à la fin de l'entrée.
L'avantage de cette approche est de 2 fois:
- Valeur non valide est pas propagé vers le modèle
- À l'aide d'une directive, il est facile d'ajouter cette validation personnalisée à n'importe quelle entrée sans dupliquer les observateurs de, encore et encore
