Eu tenho lido sobre a nova API de formulários do Angular2 e parece que existem duas abordagens em formulários, um é um formulário orientado a modelos e outro é reativo ou orientado a modelos.
Gostaria de saber a diferença prática entre os dois, não a diferença na sintaxe (obviamente), mas nos usos práticos e qual abordagem se beneficia mais em diferentes cenários. Além disso, há um ganho de desempenho na escolha de um sobre o outro? E se sim, por quê?
angular
angular2-forms
gdyrrahitis
fonte
fonte
Respostas:
Recursos de formulários acionados por modelo
[(NgModel)]sintaxe)Recursos de formulários reativos
fonte
Eu acho que é uma discussão sobre código , estratégia e experiência do usuário .
Em resumo, mudamos para uma abordagem orientada a modelos , que é mais fácil de trabalhar com ela, para reativa (na abordagem orientada a modelos) para nos dar mais controle , o que resulta em uma forma melhor testável, aproveitando a dissociação entre o HTML (design / A equipe de CSS pode trabalhar aqui) e as regras de negócios do componente (membros especializados em angular / js) e para melhorar a experiência do usuário com recursos como transformações reativas, validações correlacionadas e lidar com cenários complexos como regras de validação de tempo de execução e duplicação de campos dinâmicos.
Este artigo é uma boa referência: Formulários Angular 2 - Abordagem orientada a modelo e orientada a modelo
fonte
Aqui está o resumo da comparação entre formulários orientados a modelos e reativos, explicado por DeborahK (Deborah Kurata),
fonte
Formas reativas:
Formulários orientados a modelos:
Em resumos , se os formulários são muito importantes para o seu aplicativo ou se o padrão reativo for usado, você deve usar formulários reativos. Caso contrário, seu aplicativo possui requisitos básicos e simples para formulários como o login, você deve usar formulários controlados por modelo .
Existe um link oficial angular
fonte
A maneira mais fácil de saber a diferença entre formulários reativos e formulários orientados a modelos
posso dizer que se você quiser mais controle e escalabilidade, vá com formas reativas
fonte
Formulários acionados por modelo:
importado usando FormsModule
Os formulários criados com a diretiva ngModel só podem ser testados em um teste de ponta a ponta, porque isso requer a presença de um DOM
O valor do formulário estaria disponível em dois locais diferentes: o modelo de visualização, ou seja, ngModel
Validação de formulário, à medida que adicionamos mais e mais tags validadoras a um campo ou quando começamos a adicionar validações complexas de campos cruzados, a legibilidade do formulário diminui
Formas reativas:
Pode geralmente usado para aplicações em grande escala
lógica de validação complexa é realmente mais simples de implementar
importados usando ReactiveFormsModule
O valor do formulário estaria disponível em dois locais diferentes: o modelo de visualização e o FormGroup
Teste fácil de unidade: podemos fazer isso apenas instanciando a classe, definindo alguns valores nos controles do formulário e executando asserções no estado válido global do formulário e no estado de validade de cada controle.
Uso de Observables para programação reativa
Por exemplo: um campo de senha e um campo de confirmação de senha precisam ser idênticos
Maneira reativa: basta escrever uma função e conectá-la ao FormControl
Maneira Orientada a Modelo: precisamos definir uma diretiva e de alguma forma transmitir o valor dos dois campos
https://blog.angular-university.io/introduction-to-angular-2-forms-template-driven-vs-model-driven/
fonte