la direttiva angolare richiede una mia stessa direttiva

Question

Ho una direttiva personalizzata, fatta dopo filtri Su NG-Model in un ingresso , che limita l'ingresso solo per le cifre:

     .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;
            });
        }
    };
})

.

funziona grande da solo, ma usato insieme con, apparentemente, direttiva standard richiesta, inizia a fallire.

Io uso il seguente html (Jade Syntax):

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

.

(non uso il tipo= 'numero' come si incasinato con la lunghezza massima: MaxLength Ignorato per Input Type=" Number "in Chrome , e anche ignora anche la mia direttiva)

Quando entri in cifre, funziona bene. Il campo è valido. Quando provo a inserire la cifra e poi qualche lettera, funziona bene: il campo è valido e non posso inserire la non cifra. Ma quando inizio dalla non-cifra, il campo non è valido, ma posso ancora inserire lettere, accompagnata dal seguente errore:

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

.

Riferendosi all'uso di Tolowercase nella direttiva sopra. Per favore consigli come posso cancellare questo errore e far funzionare bene la mia direttiva anche in quest'ultimo caso ed evitare l'errore.

Answer 1

Hai un validatore del campo richiesto sul campo di input.Quindi, quando si imposta il campo in bianco ("") - succede quando digiti non cifra.Il valore diventa indefinito .

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

.

Aggiungi il seguente sopra il codice sopra:

if(!inputValue) return ;

.