Professora, boa noite tudo bem?
Gostaria de saber qual a diferença entre FormBuilder e FormGroup? Na hora de instanciar um formulário no angular.
Obrigado
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!
Professora, boa noite tudo bem?
Gostaria de saber qual a diferença entre FormBuilder e FormGroup? Na hora de instanciar um formulário no angular.
Obrigado
Olá Édipo, tudo bem?
A diferença é que o FormBuilder é um serviço injetável fornecido junto com o módulo de formulários reativos. Esse serviço possui três métodos ( control(), group() e array() ). No curso, utilizamos o método group() do FormBuilder para criar instâncias de controle.
Já o FormGroup é uma classe que agrega os valores de cada filho FormControl em um objeto, com cada nome de controle como a chave. Assim, pode gerenciar o valor e o status de validação de um grupo de instâncias.
Em casos onde os formulários são muito grandes, pode ficar repetitivo o uso do FormControl.
Então, no lugar de instanciar um FormGroup e um FormControl para cada campo do formulário, você pode utilizar o serviço FormBuilder que possui uma sintaxe simplificada.
Por “baixo dos panos”, o FormBuilder vai atribuir os controles aos campos, sem precisarmos nos preocupar com isso.
Veja esse exemplo:
Com FormGroup
ngOnInit(): void {
this.formulario = new FormGroup({
conteudo: new FormControl(''),
autoria: new FormControl(''),
modelo: new FormControl('')
})
}Com FormBuilder
ngOnInit(): void {
this.formulario = this.formBuilder.group({
conteudo: [''],
autoria: [''],
modelo: ['']
})
}As duas formas estão corretas e podem ser utilizadas de acordo com a sua preferência. Nesse artigo sobre validação em formulários reativos, você pode ver outro exemplo sobre o assunto.
Bons estudos!
Muito obrigado professora, muito bem explicado! Obrigado !