Why does the EventEmitter fire?

Question

Angular

Please help me understand the essence of the EventEmitter. Here is a classic example of his work. Here you can clearly see that in the color-picker component, on click, an event is emitted:
this.selectedColorChange.emit(color);
Next, in the template of the app component, this event is received:

<app-color-picker 
  [colors]="['#f00', '#ff0', '#a00']" 
  (selectedColorChange)="change($event)"
  [(selectedColor)]="color">
</app-color-picker>

And then the function call:

change(color) {
    alert('change' + color);
  }

As a result, the value of color is passed from color-picker.component to app.component. This is all clear and correct.
But in this example, the forwarding of the same value occurs without: This mechanism is not clear to me. How can this be understood, is this a documented feature? and is it good to use it?
(selectedColorChange)="change($event)"

Answer 1

I don't understand this mechanism.

The selectedColorChange event is handled automatically because a two-way binding is set for the selectedColor property.
Documented .