Handling Forms via Form ActionsEntry 10 of 10
Summary
| Concept | React 19 | Angular |
|---|---|---|
| Submit with a function | <form action={fn}> | (ngSubmit)="submit()" |
| Read values | formData.get(), getAll() | form.getRawValue() |
| Validate | Rules in the action, return errors | Validators on the form model |
| Action result as state | useActionState → [state, formAction, isPending] | Signals set in the submit method |
| Action signature | (prevState, formData) with useActionState | No equivalent |
| After submit | Uncontrolled fields reset automatically | Values kept until reset() |
| Keep values after errors | defaultValue from returned state | Default behavior |
| Pending | isPending | isPending signal + finalize() |
| Pending in a child | useFormStatus() (react-dom) | Input or component-level service |
| Different actions per button | <button formAction={fn}> | (click) per button |
| Optimistic UI | useOptimistic (auto revert) | Signal update + manual rollback |
React 19 turns forms into actions: functions that receive FormData, return state, and run in Transitions, so pending flags, resets, and optimistic values come built in. Angular keeps the form state in a model and leaves submission, pending state, and rollback to your component and services, which is more code but fully explicit.