angualr：屬性綁定[]、事件綁定()、插值{}

1 背景

剛開始學習angular時，方括號和圓括號一臉懵逼，寫了一篇https://blog.csdn.net/jeason_chan_zju/article/details/100089216，現在使用了一段時間後，對一些概念有了更好的理解方式。對angular中的方括號、圓括號、花括再次進行總結。

2方括號[]

angular完全重寫了html中所有的基礎組件，雖然組件的屬性名相同，但是，屬性的使用方式分爲分爲動態綁定和靜態綁定兩種。動態綁定就是，屬性名使用方括號進行包裹，取等號右邊的表達式的值作爲屬性的賦值，因此，只要屬性使用方括號，雙引號中均看作表達式。靜態綁定就是，直接使用屬性名，就想原始html一樣，但是，angular使用的是自完全重構的組件，並不是像自己之前寫的那樣，不用方括號就使用html的綁定，其實是，不使用方括號，雙引號中的東西就一般看做字符串。
代碼實踐：

//ts文件，組件
red: string = "blue";

    <div class="red">red</div>    //這裏類名爲red
    <div [class]="red">red</div>  //這裏類名爲blue,就是說有方括號右側爲表達式

3圓括號()

圓括號用於事件綁定，就是觸發元素上的事件，綁定的方法就會響應，如

//ts文件，組件
go() {
//表達式...
}

    <div (click)="go()">gogo</div>   //圓括號裏面放事件

4花括號{{}}

使用花括號{{表達式}}這種方法稱之爲插值，可以放在模板中，注意裏面的表達式可以直接取public的屬性值，甚至可以直接調用函數。

  public getDate() {
    return new Date();
  }

<span>{{getDate()}}</span>