Still using ControlValueAccessor? It might be overkill 🤷
Struggling with ControlValueAccessor in Angular? You’re not alone. 🚀 Want to master Angular Signal Forms? I just released a full course where we build a real Signal Form step-by-step covering validation, async validation, dynamic fields, custom controls, and submission patterns. 👉 Enroll here: https://www.udemy.com/course/angular-signal-forms/?couponCode=021409EC66FC6440B867 In this video, I’ll show you how to simplify your custom form controls using modern Angular features like signal inputs and FormControl bindings. No need for interfaces, providers, or boilerplate. We’ll refactor a star rating custom control component, built using ControlValueAccessor, to be reactive, lean, and easy to maintain. All while keeping full integration with Angular Reactive Forms. Whether you’re building a toggle, slider, or star rating control like this one, this modern approach can drastically simplify your code. ------------------------------------------------------------------------------ 🔔 Subscribe for more Angular tutorials & tips → [🔗 https://www.youtube.com/c/briantreese?sub_confirmation=1] 👍 Like this video if you found it helpful, it really helps support the channel! ------------------------------------------------------------------------------ 🔗 Demo Links: - Before (https://stackblitz.com/edit/stackblitz-starters-1dju3hq9?file=src%2Frating-stars%2Frating-stars.component.ts) - After (https://stackblitz.com/edit/stackblitz-starters-dxgow6sv?file=src%2Frating-stars%2Frating-stars.component.ts) ------------------------------------------------------------------------------ 📚 Additional Resources: - Learn Signal Inputs (https://angular.dev/guide/signals) - Reactive Forms in Angular (https://angular.dev/guide/forms/reactive-forms) - ControlValueAccessor Overview (https://angular.dev/api/forms/ControlValueAccessor) - My course: “Styling Angular Applications” (https://app.pluralsight.com/library/courses/angular-styling-applications/table-of-contents) ------------------------------------------------------------------------------ 🎓 Angular Certification (New) If you’re looking to validate your Angular skills, there’s now an official certification built and reviewed by Google Developer Experts. It covers modern Angular concepts and is one of the first structured ways to demonstrate real-world Angular knowledge. 👉 https://certificates.dev/angular?friend=TREESE (They’re currently offering up to 50% off) ------------------------------------------------------------------------------ 🧰 About the Tools Used This video showcases Angular with signal inputs, reactive forms, and a modern approach to custom form controls. By directly binding a FormControl to a component with a signal input, you can potentially get a cleaner API with full form status tracking, no ControlValueAccessor required. ------------------------------------------------------------------------------ 📖 Chapters: 0:00 – Introduction 0:37 – Current App Setup 1:15 – Form and Template Code Review 2:00 – ControlValueAccessor Under the Hood 3:03 – Start the Refactor 5:02 – Reactive Click Handling 5:53 – Template and Input Updates 6:37 – Final Refactor: Parent Form Cleanup 7:18 – Validation & Initial Value Support 8:05 – Handling Disabled State 8:48 – Wrap-Up: When Not to Use ControlValueAccessor ------------------------------------------------------------------------------ 🙌 Like What You See? 👍 If this saved you some headaches, hit that Like button. 🧠 Have you ever struggled with ControlValueAccessor? Drop a comment below and let’s talk alternatives! 🔔 Subscribe for weekly Angular content — cleaner forms, better components, and real-world demos. ------------------------------------------------------------------------------ #Angular #ControlValueAccessor #AngularSignals #ReactiveForms #WebDevelopment #AngularTips #ModernAngular #SignalInputs #FormControl #FrontendDevelopment
Download
1 formatsVideo Formats
Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.