|
| 1 | +--- |
| 2 | +adr: "0001" |
| 3 | +status: In progress |
| 4 | +date: 2022-05-28 |
| 5 | +tags: [clients, angular, forms] |
| 6 | +--- |
| 7 | + |
| 8 | +# 0001 - Angular Reactive Forms |
| 9 | + |
| 10 | +<AdrTable frontMatter={frontMatter}></AdrTable> |
| 11 | + |
| 12 | +## Context and Problem Statement |
| 13 | + |
| 14 | +Most of the forms in our Angular applications use the template driven forms. Lately we have been |
| 15 | +noticing issues scaling and maintaining these forms. And have begun mixing the use of |
| 16 | +template-driven with reactive forms. |
| 17 | + |
| 18 | +Maintaining two ways of handling forms are complex and moving full into a single approach will |
| 19 | +ensure a more consistent experience for developers and users. |
| 20 | + |
| 21 | +## Considered Options |
| 22 | + |
| 23 | +- **Reactive forms** - Provide direct, explicit access to the underlying forms object model. |
| 24 | + Compared to template-driven forms, they are more robust: they're more scalable, reusable, and |
| 25 | + testable. If forms are a key part of your application, or you're already using reactive patterns |
| 26 | + for building your application, use reactive forms. |
| 27 | +- **Template-driven forms** - Rely on directives in the template to create and manipulate the |
| 28 | + underlying object model. They are useful for adding a simple form to an app, such as an email list |
| 29 | + signup form. They're straightforward to add to an app, but they don't scale as well as reactive |
| 30 | + forms. If you have very basic form requirements and logic that can be managed solely in the |
| 31 | + template, template-driven forms could be a good fit. |
| 32 | + |
| 33 | +Source: https://angular.io/guide/forms-overview#choosing-an-approach |
| 34 | + |
| 35 | +## Decision Outcome |
| 36 | + |
| 37 | +Chosen option: **Reactive forms**, because our needs exceed what template-driven forms are |
| 38 | +recommended for. |
| 39 | + |
| 40 | +### Positive Consequences <!-- optional --> |
| 41 | + |
| 42 | +- You never need to think which form method to use. |
| 43 | + |
| 44 | +### Negative Consequences <!-- optional --> |
| 45 | + |
| 46 | +- Using only reactive form means we might have some additional boilerplate. |
0 commit comments