Question

J'ai une directive personnalisée, faite après filtres sur NG-Model dans une entrée , qui limite l'entrée à des chiffres:

     .directive('onlydigitinput', function () {
    return {
        require: 'ngModel',
        link: function (scope, element, attrs, modelCtrl) {
            modelCtrl.$parsers.push(function (inputValue) {
                var transformedInput = inputValue.toLowerCase().replace(/ /g, '')
                  .replace(/[^0-9]+/g, '');
                if (transformedInput != inputValue) {
                    modelCtrl.$setViewValue(transformedInput);
                    modelCtrl.$render();
                }
                return transformedInput;
            });
        }
    };
})

fonctionne très seul, mais utilisé avec, apparemment, la directive standard requise, il commence à échouer.

J'utilise le HTML suivant (Syntaxe Jade):

input(type='text' , required, onlydigitinput,  min='1', max='99', maxlength='2')

(je n'utilise pas type= 'Number' comme il gâche avec maxlength: Maxlength Ignoré pour Type d'entrée=" Numéro "dans Chrome , et ignore également ma directive)

Lorsque je saisi des chiffres, cela fonctionne bien. Le champ est valide. Lorsque j'essaie d'entrer dans le chiffre, puis une lettre, cela fonctionne bien: le champ est valide et je ne peux pas entrer non chiffre. Mais lorsque je démarre de non chiffre, le champ est invalide mais je peux toujours entrer des lettres, accompagnée de l'erreur suivante:

TypeError: Cannot read property 'toLowerCase' of undefined
at http://localhost:3000/scripts/core/directives/systemDirectives.js:63:54

faire référence à l'utilisation de Tolowrase dans la directive ci-dessus. Veuillez vous conseiller comment je peux effacer cette erreur et rendre ma directive bien fonctionner également dans ce dernier cas et éviter l'erreur.

Était-ce utile?

La solution

Vous avez un validateur de champ obligatoire sur le champ de saisie.Par conséquent, lorsque vous définissez le champ sur vide ("") - arrive lorsque vous tapez non chiffre.La valeur devient indéfinie .

var transformedInput = inputValue.toLowerCase().replace(/ /g, '')
              .replace(/[^0-9]+/g, '');
            if (transformedInput != inputValue) {
                modelCtrl.$setViewValue(transformedInput);
                modelCtrl.$render();
            }

Ajoutez le ci-dessous sur le code ci-dessus:

if(!inputValue) return ;

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top