Angular数据绑定----方括号[ ]，和圆括号（）还有花括号｛｝的使用

方括号[ ]

属性名加上方括号后，右侧赋值为表达式的值

如果属性没有方括号，右侧赋值为字符串

<div class="red">red</div>    //这里类名为red
<div [class]="red">red</div>  //这里类名为blue,就是说有方括号右侧为表达式
 
//组件中
red: string = "blue";

圆括号( )

圆括号用于事件绑定，就是触发元素上的事件，绑定的方法就会响应，如

<div (click)="go()">gogo</div>   //圆括号里面放事件
 
//组件类
go() {
 //表达式...
}

花括号{{ }}

使用花括号{{表达式}}这种方法称之为插值，可以放在模板中，注意里面的表达式不能用于赋值、运算等操作，用于显示一些值还是可以的。

<div>{{good}}</div>   //<div>你好</div> 
 
//组件类
good: string = "你好";

最后说一下字符串变量`${ }`，这个的用法，比如说用于赋值，注意加上` `反引号

goo: string = "你好";
good: string = `亲爱的${goo}`;   //等于good: string = "亲爱的你好";

转自:Angular数据绑定 - 前端笔记的个人空间 - OSCHINA - 中文开源技术交流社区