CRITICAL: Signal Forms are experimental in Angular v21. The API may change in future releases. Avoid using experimental APIs in production applications without understanding the risks.
Signal Forms is an experimental library that allows you to manage form state in Angular applications by building on the reactive foundation of signals. With automatic two-way binding, type-safe field access, and schema-based validation, Signal Forms help you create robust forms.
TIP: For a quick introduction to Signal Forms, see the Signal Forms essentials guide.
Why Signal Forms?
Building forms in web applications involves managing several interconnected concerns: tracking field values, validating user input, handling error states, and keeping the UI synchronized with your data model. Managing these concerns separately creates boilerplate code and complexity.
Signal Forms address these challenges by:
- Synchronizing state automatically - Automatically syncs the form data model with bound form fields
- Providing type safety - Supports fully type safe schemas & bindings between your UI controls and data model
- Centralizing validation logic - Define all validation rules in one place using a validation schema
Signal Forms work best in new applications built with signals. If you're working with an existing application that uses reactive forms, or if you need production stability guarantees, reactive forms remain a solid choice.
Prerequisites
Signal Forms require:
- Angular v21 or higher
Setup
Signal Forms are already included in the @angular/forms package. Import the necessary functions and directives from @angular/forms/signals:
import { form, Field, required, email } from '@angular/forms/signals'The Field directive must be imported into any component that binds form fields to HTML inputs:
@Component({ // ... imports: [Field],})