Angular Event Binding: Interactive Button Counter

This challenge focuses on a fundamental Angular concept: event binding. You will create an interactive component that responds to user actions by updating its internal state and displaying the result. This is a crucial skill for building dynamic and user-friendly web applications in Angular.

Problem Description

Your task is to create an Angular component that displays a counter and a button. When the button is clicked, the counter should increment by one.

Key Requirements:

• Create a new Angular component.
• The component should have a property to store the current count, initialized to 0.
• The component's template should display the current count.
• The component's template should include a button.
• When the button is clicked, an event handler method in the component should be triggered.
• This event handler method should increment the count property.

Expected Behavior:

1. Initially, the component displays "Count: 0".
2. Each time the button is clicked, the displayed count increments by one (e.g., "Count: 1", "Count: 2", etc.).

Edge Cases:

• No specific edge cases to consider for this basic implementation beyond ensuring the counter increments correctly.

Examples

Example 1:

• Initial State (Component Loaded):

  • Component's count property: 0
  • Template displays: Count: 0
  • Button is visible and clickable.

• After clicking the button once:

  • Component's count property: 1
  • Template displays: Count: 1

Example 2:

• After clicking the button five times consecutively:
  • Component's count property: 5
  • Template displays: Count: 5

Constraints

• The solution must be implemented in TypeScript within an Angular project.
• You should create a single component.
• The component should be standalone or part of a module.

Notes

• Recall how to declare a property in your Angular component class.
• Think about how to display a component's property value in its template.
• Consider Angular's syntax for binding to DOM events.
• You'll need to define a method in your component class to handle the button click event.