Explain Property Bindings in Angular?

Property binding allows us to bind HTML element property to a property in the component. Whenever the value of the component changes, Angular updates the element property in the View. You can set the properties such as class, href, src, textContent, etc using property binding.

The Property Binding uses the following Syntax:

  • The binding target (or target property) is enclosed in a square bracket [].
  • It should match the name of the property of the enclosing element
  • Binding source is enclosed in quotes and we assign it to the binding target.
  • The Binding source must be a template expression
  • It can be property in the component, method in the component, a template reference variable or an expression containing all of them
  • Whenever the value of Binding-source changes, the view is updated by the Angular