Angular上手学习笔记
1.安装node.js:下载地址:http://nodejs.cn/download/
2.安装angular:npm install -g @angular/cli
3.创建angular应用:ng new angular-tour-of-heroes
4.进入应用:cd angular-tour-of-heroes
5.启动应用服务:ng serve --open
英雄编辑器
-
你使用 CLI 创建了第二个组件
HeroesComponent
。 -
你把
HeroesComponent
添加到了壳组件AppComponent
中,以便显示它。 -
你使用
UppercasePipe
来格式化英雄的名字。 -
你用
ngModel
指令实现了双向数据绑定。 -
你知道了
AppModule
。 -
你把
FormsModule
导入了AppModule
,以便 Angular 能识别并应用ngModel
指令。 -
你知道了把组件声明到
AppModule
是很重要的,并认识到 CLI 会自动帮你声明它。
显示英雄列表
-
英雄指南应用在一个主从视图中显示了英雄列表。
-
用户可以选择一个英雄,并查看该英雄的详情。
-
你使用
*ngFor
显示了一个列表。 -
你使用
*ngIf
来根据条件包含或排除了一段 HTML。 -
你可以用
class
绑定来切换 CSS 的样式类。
主从组件
-
你创建了一个独立的、可复用的
HeroDetailComponent
组件。 -
你用属性绑定语法来让父组件
HeroesComponent
可以控制子组件HeroDetailComponent
。 -
你用
@Input
装饰器来让hero
属性可以在外部的HeroesComponent
中绑定。