If we look through the template in app.component.ts, we will see several places where square brackets [ ] are used. These are property bindings.

Let's look at the first of the bindings that we created:

<input type="number" [value]="guess" (input)="guess = $event.target.value" />

This binding works by linking the value of the guess property in our component class to the value of the input field in the view. The binding is dynamic; so, as the value of the guess property changes, the value of the input field will be synchronized to the same value; and we do not have to write any code to do that.

At the outset, when we initialize the game, this property is set to null in the initialization method of the component class, so we will not see anything in the input field. However, as the game progresses, this number will be updated with the value of the guess as it changes.