Создание и использование реактивных форм | Angular Forms | Angular 13+

Описание: На этой лекции вы узнаете, как создать реактивную форму в Angular. Мы уже подробно рассмотрели шаблонные формы в Angular. Теперь давайте поговорим о реактивных формах. Реактивные формы определяются в классе TypeScript.

В отличие от шаблонных форм, структура реактивной формы определяется в классе TypeScript. Даже валидация реактивной формы выполняется в классе TypeScript. Нам всё ещё нужно создать форму с помощью HTML, но мы можем связать HTML-форму с реактивной формой, определённой в классе TypeScript, с помощью директивы formGroup.

Кроме того, мы определяем элементы управления реактивной формы в классе TypeScript, используя класс FormControl. Также мы можем задать значение по умолчанию для каждого элемента управления формы, передав его конструктору FormControl().

Давайте изучим создание и использование реактивной формы на примере в этой лекции.