0

Muy buenas!

Actualmente tengo un problema con una validación personalizada que estoy haciendo.

Tengo este método:

validateInstagram(): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
      const value = control.value;
      let valid = false;

      if (!value) {
        return null;
      }

      let match = value.match(keys.ctrl_instagram_pattern);

      if(match === null || match![0] !== value) valid = false; else valid = true;

      console.log(valid ? { instaValid: true } : null);
      
      return valid ? { instaValid: true } : null;
    }
  }

Que se encarga de validar que una cuenta de instagram está bien construida o no mediante una expresión regular.

Cómo se ve en el return, si la cuenta es válida, retorna un objeto, si no, retorna null.

El problema es que cuando pasa la validación, no me la pasa bien a pesar de que veo claramente que el resultado es el que creo que es el bueno, me explico.

Cuando lo ejecuto, mirando por consola los valores, veo lo siguiente:

introducir la descripción de la imagen aquí

Me está devolviendo null y el estado de ese controlador es VALID, cuando entiendo que debería de ser al revés.

Siguiendo está lógica, si pongo en el return lo siguiente:

return valid ? null : { instaValid: true };

Se comporta como debería.

Cómo puedo arreglar esto?

3
  • esto está mal escrito if(match === null || match![0] !== value) sobra ! en match[0]. Dudo que sea este el error
    – hawks
    el 10 abr. 2021 a las 10:49
  • No, ese no es el error, en la última actualización de angular (creo que fue por esto), metieron este tipo de validaciones, te obliga a poner ! o ? para controlar los posibles valores nulos.
    – Victor
    el 10 abr. 2021 a las 10:59
  • ahh muy bien. Gracias por la info
    – hawks
    el 10 abr. 2021 a las 17:14

1 respuesta 1

0

Según me han comentado, el error está en que lo estoy haciendo al revés, las funciones de validación devuelven un objeto cuando falla y devuelve un valor null cuando no.

Por lo tanto, el código de la función debería de ser así:

  validateInstagram(): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
      const value = control.value;
      let valid = false;

      if (!value) {
        return null;
      }

      let match = value.match(keys.ctrl_instagram_pattern);

      if(match === null || match![0] !== value) valid = false; else valid = true;
      
      return valid ? null : { instaValid: false };
    }
  }

Yo pensaba que funcionaban al revés.

1
  • Así es. Cuando se genera en un error se retorna un objeto que contiene suficiente información para identificar el problema, de lo contrario, no se retorna nada o null.
    – Legna
    el 10 abr. 2021 a las 15:00

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.