Attribute 绑定、类绑定和样式绑定
1. 绑定到 Attribute
优先设置带有 Property 绑定的元素的 Property。如果没有可绑定的元素 Property，可以使用 Attribute 绑定。
例如，ARIA和SVG 只有 Attribute。 ARIA 和 SVG 都不对应于元素的 Property，也不设置元素的 Property。在这些情况下，必须使用 Attribute 绑定，因为没有相应的目标 Property。
<p [attr.attribute-you-are-targeting]="expression"></p>
当表达式解析为 null 时，Angular 会完全删除该 Attribute。
用例
用例1：设置 ARIA Attribute
<!-- create and set an aria attribute for assistive technology --><button [attr.aria-label]="actionName">{{actionName}} with Aria</button>
用例2：绑定到 colspan
colspan Attribute 可帮助你以编程方式让表格保持动态。根据应用中用来填充表的数据量，某一行要跨越的列数可能会发生变化。
要将 Attribute 绑定到 的 colspan Attribute：
使用以下语法指定 colspan：[attr.colspan] 。将 [attr.colspan] 设置为等于某个表达式。
在下面的示例中，我们将 colspan Attribute 绑定到表达式 1 + 1。
<!-- expression calculates colspan=2 --><tr><td [attr.colspan]="1 + 1">One-Two</td></tr>
注意：有时，Property 名和 Attribute 名之间存在差异。
colspan 是 的 Attribute，而 colSpan（注意 “S” 是大写）是 Property。使用 Attribute 绑定时，请使用带小写 “s” 的 colspan。有关如何绑定到 colSpan Property 的更多信息，请参见 Property 绑定 中的 colspan 和 colSpan 部分。
绑定到 class Attribute
可以使用类绑定从元素的 class Attribute 中添加和删除 CSS 类名称。
绑定到单个 CSS class
要创建单个类绑定，请使用前缀 class 后跟一个点和 CSS 类的名称，例如[class.sale]="onSale"。onSale 为真值时添加类，在表达式为假值时（undefined 除外）删除类。
绑定到多个 CSS 类
要绑定到多个类，请使用 [class] 来设置表达式。例如，[class]="classExpression"。
表达式可以是用空格分隔的类名字符串，也可以是将类名作为键并将真或假表达式作为值的对象。对于对象格式，Angular 会在其关联的值为真时才添加类。
对于任何类似对象的表达式（例如 object、Array、Map 或 Set，必须更改对象的引用，Angular 才能更新类列表。在不更改对象引用的情况下只更新其 Attribute 是不会生效的。
如果同一类名有多个绑定，Angular 会根据样式优先级来确定要使用的绑定。
绑定到 style Attribute
使用样式绑定来动态设置样式。
绑定到单一样式
要创建对单个样式的绑定，请使用前缀 style 后跟一个点和 CSS style Attribute 的名称。
例如[style.width]="width"。 Angular 会将该 Attribute 设置为绑定表达式的值，这个值通常是一个字符串。（可选）你还可以添加单位扩展，例如 em 或 % ，它的值需要数字类型。
可以用中线格式或 camelCase 格式编写样式 Attribute 名。
绑定到多个样式
要切换多个样式，请绑定到 [style] Attribute，例如[style]="styleExpression"。该表达式通常是样式的字符串列表，例如 “width: 100px; height: 100px;” 。
还可以将表达式格式化为对象，此对象以样式名作为键、以样式值作为值，例如 {width: ‘100px’, height: ‘100px’}。
对于任何类似对象的表达式（例如 object、Array、Map 或 Set，必须更改对象的引用，Angular 才能更新类列表。在不更改对象引用的情况下更新其 Attribute 值是不会生效的。
如果同一个样式 Attribute 有多个绑定，Angular 将使用样式优先级来确定要使用的绑定。
—— END ——
如果觉得《Attribute 绑定 类绑定和样式绑定》对你有帮助，请点赞、收藏，并留下你的观点哦！
