Let’s say you have an input element in your Angular template and you want to set its disabled attribute and its value property dynamically. You can use attribute binding to set the disabled attribute and property binding to set the value property like this:

<input [disabled]="isDisabled" [value]="inputValue">

In this example, isDisabled and inputValue are variables defined in your component class.

export class MyComponent {
  isDisabled = true;
  inputValue = "Hello World";
}

In this example, the isDisabled variable is used to set the disabled attribute dynamically, while the inputValue variable is used to set the value property dynamically.

Note : that in the template, we use square brackets ([ ]) to indicate that we’re using property binding or attribute binding. When using property binding, the brackets contain the property name, while with attribute binding, the brackets contain the attribute name.