Page 37 - 6182

Реактивні форми (Reactive forms)
Шаблонно-керовані форми передбачають дуже багато різного
роду розмітки у вигляді атрибутних директив і т.д. Платформа

Angular пропонує також інший – реактивний підхід, який
передбачає створення елементів управління форми шляхом
прописування відповідних полів класів.
Для цього є визначені спеціальні класи FormControl,

FormGroup, FormBuilder. З допомогою цих засобів, можна створити
дерево об‘єктів FormControl, об‘єднати їх з допомогою FormGroup
або FormBuilder і відповідно прив‘язати їх потім до шаблону. На

рисунку 5.2 показаний приклад декларації форми з використанням
реактивного підходу.

Рисунок 5.2 – Приклад декларації реактивно форми з
використанням FormGroup

Реактивний підхід є дуже зручним при необхідності

забезпечити різного роду перевірку введених даних з
використанням об‘єктів валідаторів. В Angular також є визначений
клас FormBuilder, який дозволяє генерувати форми з

використанням реактивного підходу, шляхом літерального
визначення об‘єкту з параметрами. На рисунку 5.3 наведено
фрагмент коду з використанням такого підходу.

Для використання валідаторів – спеціальних об‘єктів для
перевірки введених даних необхідно, прописати їх до відповідних
елементів форми. На рисунку 5.4 наведено приклад використання

існуючого валідатора з використанням FormBuilder.

37