Reactive Powered: RxJS with Angular Forms
summary
Live demo builds a cinema seat selector using Angular Reactive Forms plus RxJS: each seat is a ControlValueAccessor form control, the form is created from a room config observable, and real‑time server streams occupied/released seats drive enable/disable of controls without emitting unwanted valueChange events. An async validator calls the DB service to confirm occupancy, status errors emit for 5s, and selection is counted with Subjects plus scan — the demo reacts to server races, unselects conflicted seats, and the UI updates correctly.
AI-written summary · about
chapters (25)
- 0:00Intro
- 0:31Presentation Overview
- 1:18Who is this for
- 1:52Demo
- 4:13Architecture
- 5:05Configuration
- 6:00Why a Form
- 7:41Reactive Programming
- 11:31Take it one step at a time
- 11:53Start with a few operators
- 12:51Streams of data observables
- 14:26Initialize the form
- 17:18Build the form
- 18:08Implement the control
- 19:44Implement the form control
- 22:36Disabling the seat
- 23:51Realtime updates
- 26:41Set value vs patch value
- 28:41Value changes
- 29:36Validation
- 31:23validators
- 36:04reacting to an error
- 39:02counting seats
- 41:02notes
- 41:54summary
related talks
50mReactive Powered: RxJS with Angular Forms
31mExtreme reactive forms in Angular
34mForm of Art.
24mReactive Powered: RxJS with Angular Forms
45mReactive Frontends with RxJS and Angular
01h 07mReactive Frontends with RxJS and Angular - Sergi Almar
51mReactive programming in Angular
35mLet's Build a Form Around It