显示数据
在 Angular 中最典型的数据显示方式,就是把 HTML 模板中的控件绑定到 Angular 组件的属性。
使用插值表达式显示组件属性
Angular 自动从组件中提取属性的值,并且把这些值插入浏览器中。当这些属性发生变化时,Angular 就会自动刷新显示。严格来说,“重新显示”是在某些与视图有关的异步事件之后发生的,例如,按键、定时器完成或对 HTTP 请求的响应。
注意,我们没有调用 new 来创建AppComponent类的实例,是 Angular 替我们创建了它。那么它是如何创建的呢?
- 注意@Component装饰器中指定的 CSS 选择器selector,它指定了一个叫my-app的元素。 该元素是index.html的body里的占位符。
- 当我们通过main.ts中的AppComponent类启动时,Angular 在index.html中查找一个<my-app>元素, 然后实例化一个AppComponent,并将其渲染到<my-app>标签中。
用构造函数的参数直接定义属性:
public id: number,
这个简写语法做了很多:
- 声明了一个构造函数参数及其类型
- 声明了一个同名的公共属性
- 当我们new出该类的一个实例时,把该属性初始化为相应的参数值