Скачать с ютуб Angular's New Model Inputs: Two-way Communication with your Child Components в хорошем качестве

Angular's New Model Inputs: Two-way Communication with your Child Components

In Angular, we often want two-way communication between our parent component and its child component. The parent passes a value to the child component. The child component modifies that value, and passes the changed value back to the parent. Accomplishing this task used to be a bit complicated. The child component would define an @Input property to get the value from the parent component. And define an @Output property to send a notification event with the new value. Starting in Angular version 17.2, we can use a model input to easily two-way bind data between a parent component and a child component! In this video, we examine the new model input. We then walk through how to react to changes in that input: first using event binding, then using computed signals. NOTE There is an error at time code 10:50. The parent component code I pasted into the diagram doesn't match the binding in that same diagram. The correct parent component code should be: amount = signal(''); length = computed(() =* this.amount().length); *This is supposed to be an arrow function by YT doesn't allow angle brackets in the description. 😉 Links YouTube video "Angular's New Signal Inputs":    • Angular's New Signal Inputs   Code: https://stackblitz.com/edit/model-inp... Content 00:00 Model input in Angular 00:59 Sample application 02:22 Two-way binding 03:27 Using a model input 05:18 Aliasing a model input 06:08 Required model input 06:56 Reacting to changes: event binding 09:23 Reacting to changes: signals 10:32 Wrap Up ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ 😊About Me Hey! I'm Deborah Kurata I'm a software developer and YouTube content creator. I speak at conferences such as VS Live and ng-conf. I write articles for freeCodeCamp. And I'm a Pluralsight author with courses in the top 10 most popular (out of 7,000+) over the past 5 years. For my work in support of software developers, I've been recognized with the Microsoft Most Valuable Professional (MVP) award, and I'm a Google Developer Expert (GDE). Contact me on Twitter:   / deborahkurata   Find my Pluralsight courses: https://www.pluralsight.com/profile/a... Access my freeCodeCamp articles: https://www.freecodecamp.org/news/aut... View my YouTube content:    / @deborah_kurata   ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ #angular #bestpractices #angulartutorial #angularparentchild #componentcommunicationinAngular #angularcomponentcommunication #angularmodelinput #modelinputsangular #angular17.2modelinputs #angularmodelinputrequired #angularmodeltutorial #angularinput #angularrequiredinput