Property binding []

This is the documentation for Angular 7.
You can switch to the latest version Angular 10.

Write a template property binding to set a property of a view element. The binding sets the property to the value of a template expression.

The most common property binding sets an element property to a component property value:

<img [src]="imageUrl" style="height:150px">

Another is setting a property of a directive:

<div [ngClass]="classes">
  [ngClass] binding to the classes property
</div>

Or setting the model property of a custom component (a great way for parent and child components to communicate):

<user-panel [name]="userName"></user-panel>

Some people prefer the bind- prefix alternative, known as the canonical form:

<user-panel bind-name="userName"></user-panel>