Angular's New Signal Inputs

In Angular, we often need our parent components to communicate with their child components. And we've used @Input properties for that communication. Starting in Angular version 17.1, we now have signal-based inputs as an alternative to @Input properties. That makes it easier to react to changes to those inputs.

In this video, we examine the new signal inputs feature and outline its benefits.

Links
YouTube video "Angular's New Template Syntax: Control Flow": Angular's New Template Syntax: Contro...

Code: https://stackblitz.com/edit/signal-in...

Content
00:00 Signal inputs in Angular
00:30 Sample application
01:40 @Input property
03:00 Computed signals
04:43 Passing data to a child component
06:19 Using a signal input
07:14 Transforming a signal input
08:22 Aliasing a signal input
08:55 Required signal input
09:54 Benefits of signal inputs
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: 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
#angularsignalinputs
#signalinputsangular
#angular17.1signalinputs
#angularsignalinputrequired
#angularsignaltutorial
#angularinput
#angularinputtransformation

• #science_technology
• #angular
• #best_practices
• #angular_tutorial
• #demo
• #angular_parent_child
• #component_communication_in_angular
• #angular_signals
• #angular_signal_input
• #signal_inputs_angular
• #angular_input_signals
• #signals_in_angular
• #signal_input
• #angular_signal_inputs
• #angular_signals_tutorial
• #angular_171_signal_inputs
• #angular_signal_input_required
• #signals_angular
• #signal
• #angular_signal_output
• #angular_signal_tutorial
• #angular_input
• #signals_angular_app
• #angular_input_transformation