Скачать или смотреть Angular input change detection using property setter

In this video we will discuss how to detect and react when component input property value changes using a property setter.

Healthy diet is very important for both body and mind. We want to inspire you to cook and eat healthy. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking.
   / @aarvikitchen5572  

In our previous video we discussed, detecting and reacting to INPUT property changes using ngOnChanges life cycle hook. In this video we will discuss doing the same using a Property Setter instead.

Text version of the video
http://csharp-video-tutorials.blogspo...

Slides
http://csharp-video-tutorials.blogspo...

Angular CRUD Tutorial
   • Angular CRUD tutorial  

Angular CRUD Tutorial Text Articles & Slides
http://csharp-video-tutorials.blogspo...

All Dot Net and SQL Server Tutorials in English
https://www.youtube.com/user/kudvenka...

All Dot Net and SQL Server Tutorials in Arabic
   / kudvenkatarabic  

Detecting and reacting to Input property changes using Property Setter

// Private backing field for the property
private _employee: Employee;

// This property setter is called anytime the input property changes
// Notice the code here logs the previous and current employee names
@Input()
set employee(val: Employee) {
console.log('Previous : ' + (this._employee ? this._employee.name : 'NULL'));
console.log('Current : ' + val.name);
this._employee = val;
}

// This getter is called when reading and displaying data
get employee(): Employee {
return this._employee;
}

At this point you might be thinking, there are 2 ways to detect and react to Input property changes (Property Setter and ngOnChanges life cycle hook). What is the difference between the two and when to use one over the other. We will answer these 2 questions in our next video.