From the course: Reactivity and Signals in Angular
Unlock this course with a free trial
Join today to access over 24,900 courses taught by industry experts.
Two-way binding with signals using model inputs - Angular Tutorial
From the course: Reactivity and Signals in Angular
Two-way binding with signals using model inputs
- [Instructor] The first time I realized I wanted to write angular code was when I saw someone demonstrate two-way binding. Angular enables two-way binding and form controls using NG model, but it also enables two-way binding between components. Two-way binding between components allows child components to propagate changes back to their parent component. Creating inputs that could instantly affect elements and other components was not an easy feat in vanilla JavaScript. Angular made it a lot easier, but setting up two-way binding with decorator based inputs and outputs required very specific boilerplate code. To simplify two-way binding and leverage signals reactivity, Angular introduced the signal based model input. Model inputs are declared in the child component. They can be bound in the parent component template using the banana in a box syntax. Banana in a box binds the value of the parent property to the child component while setting up an event listener on the parent that…