Comparing Angular Forms

on YouTube ↗21m

" summary

Compares Angular’s template-driven forms with reactive forms and claims reactive is more scalable, testable and predictable. Shows concrete APIs: FormControl/FormGroup/FormArray and FormBuilder to avoid repeated new calls, demonstrates Validators plus a custom pure-function validator that forbids the name "Bob", and uses the formControl.valueChanges observable for live reactions. Describes template change detection via ng-touched ng-dirty ng-valid CSS classes, explains template forms require rendering for tests while reactive forms are synchronous and manipulable entirely in code.

AI-written summary · about

" chapters (17)

1. 0:00Intro
2. 0:52Angular Documentation
3. 1:38Template Forms
4. 2:08Basic Forms
5. 2:20Component Class
6. 2:44HTML Template
7. 3:18Example
8. 4:25Change Detection
9. 6:34Error Handling
10. 7:47Reactive Forms
11. 8:20Reactive Forms API
12. 8:56Reactive Forms in Angular
13. 10:36Form Builder
14. 11:39Validators
15. 12:43Custom Validation
16. 13:45Control Value Changes
17. 15:26Reactive vs Template Forms

" related talks

• 48mHandling Angular Forms Without Losing Your SanityJennifer Wadella · NDC Sydney 2019
• 28mHandling Angular Forms Without Losing Your SanityJennifer Wadella · NG-DE Conference 2019
• 43mAngular Reactive Forms - Developing Forms and Validation with AngularFabian Gosebrink · Voxxed Days Zürich 2022
• 26mReactive Forms OverviewMichele Stieven · Angular Day 2017
• 47mReactive forms in AngularHardik Pithva · GDG DevFest Ahmedabad 2017
• 35mLet's Build a Form Around ItSani Yusuf · ComponentsConf 2019
• 20mLet’s Build A Form Around ItSani Yusuf · NGConf 2018
• 36mUnleash the Power of Angular Reactive FormNir Kaufman · AngularUP 2017