0
respostas

Desafio: crie uma validação customizada

Conforme solicitado, segue implementação do desafio. Foi criado na pasta pensamentos o seguinte arquivo

//pensamento.validator.ts
import { AbstractControl } from "@angular/forms";


export class CustomValidators {

    public static lowerCase(control: AbstractControl) {
        if(control.value !== control?.value.toLowerCase()){
            return {minusculo: true};
        } else return null;
    }
};

No arquivo criar-pensamento.componentes.ts:

//criar-pensamento.componentes.ts

//outros imports

import { CustomValidators } from '../pensamento.validator';

//código omitido

  ngOnInit(): void {
    this.formulario = this.formBuilder.group({
      conteudo: ['', Validators.compose([
        Validators.required,
        Validators.pattern(/(.|\s)*\S(.|\s)*/),
      ])],
      autoria: ['', Validators.compose([
        Validators.required,
        Validators.minLength(3),
        CustomValidators.lowerCase

      ])],
      modelo: ['modelo1'],
    })
  }

No template do componente:

//código omitido
@else if (
    formulario.get('autoria')?.errors?.['minusculo'] &&
    formulario.get('autoria')?.touched
) {
    <div class="mensagem__erro">
        Autoria deve ser escrita em minúsculo!
    </div>
}