Current value at counter: {{ counterValue }}

<!--  EXERCISE - COUNTER -->
<!-- <app-counter
    [counterValue]="counterValue"
    (changedValue)="onUpdatedValueOnCounter($event)"
></app-counter> -->
<app-counter
    [(counterValue)]="counterValue"
></app-counter>

<hr>

<!-- EVENT BINDING - EXAMPLES -->
<button 
    (click)="onClickEmitButton($event)">
    Click emit information
</button><br><br>

<button 
    (click)="onClick($event)"
    (mouseenter)="mouseEnter()"
>Click here!</button><br><br>

<input type="text" 
    [value]="initialValue" 
    (keyup)="enteredSomething($event)"><br><br>

Input value: {{ inputValue }}

<hr>

<!-- PROPERTY BINDING - EXAMPLES -->
<h2>Property Binding Examples</h2>

<h3>Word: {{ car }}</h3>
<h3>Color: {{ color }}</h3>
<!-- DATA BINDING [] -->
<input type="text" [value]="initialValue"><br>

<button [disabled]="isDisabled">Click here!</button><br>

<p [attr.aria-label]="isDisabled ? 'Disabled button' : accessibilityText">
    Any text...
</p><br>

<img [src]="getImageURL()" alt="MD-11 airplane">