Эволюция форм в Angular
Angular всегда предлагал два подхода к работе с формами: шаблонные формы (Template-driven forms) и реактивные формы (Reactive forms). Однако с выходом версии 21 появилась новая концепция — Signal Forms, основанная на сигналах.
Предыстория: Template-driven и Reactive Forms
В традиционных формах данные привязываются напрямую через шаблоны или управляются вручную через классы FormGroup и FormControl. Это позволяет легко создавать сложные формы, однако требует дополнительных усилий при обработке изменений данных.
Что такое Signal Forms?
Сигналы (Signals) — это механизм обновления данных в Angular, который заменит устаревшую систему зон (Zone.js), используемую ранее для отслеживания изменений. Сигнал представляет собой значение, которое может изменяться асинхронно, а подписчики автоматически получают уведомления об изменениях.
Основные преимущества Signal Forms:
- Производительность: меньше накладных расходов за счёт отказа от Zone.js.
- Простота использования: более интуитивный синтаксис и меньшее количество кода.
- Гибкость: возможность комбинировать сигналы с другими источниками данных.
Как работают Signal Forms?
При использовании Signal Forms форма становится объектом сигнала, который обновляется автоматически при изменении значений полей. Например, вместо создания экземпляра класса FormGroup можно использовать сигнал, который будет содержать текущее состояние формы.
const form = signal({ name: '', email: '' });
Затем вы можете получать доступ к значениям поля так же просто, как обращаться к свойствам объекта.
<input [(ngModel)]="form().name" />
Таким образом, работа с формой сводится к простому управлению состоянием сигнала, что значительно упрощает код и повышает производительность приложения.