Let's revisit the timer component functionality that we already saw in Chapter 1,
Creating Our Very First Component in Angular, and let's imagine that we want our component to have a configurable attribute so that we can increase or decrease the countdown time:

<timer [seconds]="25"></timer>

Please note the attribute wrapped between brackets. This informs Angular that this is an input property. The class that models the timer component will contain a setter function for the seconds property, which will react to changes in that value by updating its own countdown duration. We can inject a data variable or an actual hardcoded value, in which case we will have to wrap it around single quotes within the double quotes should such a value be a text string.

Sometimes we will see this syntax while injecting data into our component's custom properties, while at other times we will use this very bracket syntax to make native HTML attributes reactive to component fields, like this:

<h1 [hidden]="hideMe">
   This text will not be visible if 'hideMe' is true
</h1>