We saw the easiest form of property binding through interpolation before. But it is better to use interpolation if you want to show a message between HTML tags. In order to edit the properties of a DOM element, we use different syntax as follows:
[property]="expression"
For example, in the following DOM element:
<input type="email" [placeholder]="emailPlaceHolder" >
The square brackets indicate that we are binding the <input> placeholder property to the emailPlaceHolder property defined somewhere in a component class:
// some component class
export class EmailComponent {
emailPlaceHolder = "please enter your email";
}
We can apply similar syntax to bind to a CSS class or even a CSS style.