Olá! Eu queria saber qual a utilidade da propriedade [disabled]="!formulario.valid", sendo que a diretiva [ngClass]="habilitarBotao()" já faz a função desejada no botão cancelar.
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Olá! Eu queria saber qual a utilidade da propriedade [disabled]="!formulario.valid", sendo que a diretiva [ngClass]="habilitarBotao()" já faz a função desejada no botão cancelar.
Oi Luana, tudo bem?
A propriedade [disabled]="!formulario.valid" tem a utilidade de desabilitar o botão quando o formulário não estiver válido. Isso significa que, se algum campo obrigatório não estiver preenchido ou se alguma validação não estiver sendo cumprida, o botão ficará desabilitado.
Já a diretiva [ngClass]="habilitarBotao()" tem a função de aplicar uma classe CSS condicionalmente ao botão. No exemplo dado, a classe botao__desabilitado é aplicada quando o formulário não está válido, deixando o botão com uma aparência diferente.
Essas duas funcionalidades podem ser combinadas para melhorar a experiência do usuário ao interagir com o formulário. Enquanto a propriedade disabled impede que o botão seja clicado quando o formulário não está válido, a classe CSS aplicada através da diretiva ngClass pode dar um feedback visual para o usuário, indicando que o botão está desabilitado.
Espero ter ajudado.
Um abraço e bons estudos.