#27 @Output: Custom Event Binding | Angular Components & Directives | A Complete Angular Course 

The first rather difficult lesson in the series. At the first viewing, I begin to get confused in the exchange of data between components. In my opinion, it is much easier to implement a filter in the react.

Very nicely explained. thanks.

Great video and explanation 🔥

React is like why Angular why ?? this angular concept is so confusing to understand. I think I need to rewatch this, but this series is great, making learning Angular smoother.

To clarify: When [value] = [(ngModel)] the radio is selected.

writing code is neat and clean. Excellent !

Very good

I don't know what to say sir but thanks in a million

Excellent sir .....❤

This is how I break down this concept for easier understanding: The Child component class has three key parts, two are used in its view template and one used in the Parent view template. Child Class parts 1. A declared property of an EventEmitter instance, decorated with @Output() 2. A declared data property to hold the current state 3. A class method to handle events Utilization in Child View 1. Two-way property binding with ngModel directive (i.e., on a HTML tag) to the declared data property 2. Event binding (i.e., change event on the same HTML tag) calling the class method which handles events Parent component class has one key part that is used in conjunction with the remaining key part from the Child component class. Both are used in the Parent view. Parent Class Part 1. A callback method which acts as the event handler, receiving and processing emitted data. Utilization in Parent View 1. Event binding on the selector of the child component (i.e., app-child), to the declared property with the EventEmitter instance. This declared property is from the child component class and is the custom event. 2. Assignment of the callback method which process emitted data, to the custom event. This method should be defined in the Parent component class.

Mast Samjhaya

could you please upload a complete project upto this class in the repo, it would be very helpful to keep on the track our learning.

super clear and very detailed tutorials. thanks so much!

3:22 you said, " ngModule is structure directive like ngCass and ngStle"!! I think you mean ngIf and ngFor?

Excellent !, where is the video-related code repo ?

how to get the exact code that you have used in this video , you have provided the repo link , but the code there is different from what you have used here , if you could guide me it would be helpful. cheers!!!. Great explanation btw

@procademy Introduction to Angular.pdf is not available, it's showing Unable to render code block...

Hi @procademy, some of the important files are missing in the repo such as filter.component.ts and product.component.ts files , please update asap , thanks

how is this couch? where do i find more courses for him ? anybody knows ?

@procademy why the git is not updated?

02:08 @procademy what would be the value if we have four radio buttons in our template. Here we have 3 so we went with 'all' 'true' and 'false' but what about the fourth one??

3:17 ngModel is an attribute directive right?

Hiii bro, where is this source code of this @Output() decorator....

Where to find codebase of this video.

you said that "ngModel" is a Built-in structural directive like ngStyle and ngClass, but actually ngStyle and ngClass are not structural directive ! They are attribute directive

property I do not understand how the property 'selectedFilteredRadioButton' became the standard selector of the radio bullet simply by asigning the value of the tag to it. Can someone please enlighten me?

Sir, there should be some more clarity

please upload this code in repo.

bit confusing this time.became more clear when watched again

instead of ngIf you could have created a function like filteredProject and basically filter products from the selectedfilter value

SIR source code?

i guess you didn't use the @output

react laughing in the corner...