What's the difference between Angular property and attribute binding?

Tests whether you know Angular binds to DOM properties by default. [disabled] sets a DOM property; [attr.role] sets an HTML attribute. Use attribute binding when no DOM property exists, such as SVG attributes or role. Red flag: claiming they are equivalent.
Whether you understand that Angular property bindings write directly to DOM properties, not HTML attributes, and that attribute binding is required when no corresponding DOM property exists. [disabled] updates the HTMLButtonElement property, while [attr.role] writes to markup attribute. You must use attribute binding for attributes without DOM counterparts, such as SVG attributes or role attribute. RED FLAG: Treating properties and attributes as interchangeable or saying [value] and [attr.value] behave identically.
Read the original → angular.dev
- #angular
- #templates
- #property-binding
- #attribute-binding
- #dom
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.