【Angular6+】属性及样式绑定

Angular6_属性及样式绑定

Angular 通过 [] 来绑定数值、变量或者表达式，这种绑定是 单向数据绑定。

属性绑定

属性绑定分为两种

• Property
  元素的常规属性，比如 src、disabled 等

  
  Cancel is disabled
  [ngClass] binding to the classes property
  

• Attribute

  元素的非常规属性，比如 colspan 等

  
    One-Two
  

CSS 类绑定

借助 CSS 类绑定，可以从元素的 class attribute 上添加和移除 CSS 类名。

Bad curly

The class binding is special

样式绑定

样式绑定的语法与属性绑定类似。 但方括号中的部分不是元素的属性名，而由 style 前缀，一个点 (.)和 CSS 样式的属性名组成。 形如：[style.style-property]。

Red
Save
Big
Small