变量

模板输入变量

  1. <hero-detail *ngFor = "let hero of heroes" [hero] = "hero">
  2. </hero-detail>

let关键字创建了一个名叫hero的模板输入变量 ngFor指令每次迭代都从数组中把当前元素赋值给hero变量 可以在ngFor的宿主元素(及其子元素)中引用模板输入变量hero

模板引用变量

  1. <button #buttonDOM></button>
  2. {{buttonDOM}}

表达式

插值表达式

模板表达式

模板语句

绑定类型 语法 分类
插值
属性
Attribute
CSS 类
样式
{{expression}}
[target]="expression"
bind-target="expression"
单向
从数据源到视图
事件 (target)="statement"
on-target="statement"
单向
从视图到数据源
双向 [(target)]="expression"
bindon-target="expression"
双向