1. Angular 模块引导
Angular没有了类似AngularJS中的<body ng-app="my-app">这样的引导指令了?
通过显示调用? bootstrap? 函数，并传入应用模块的名字(? AppComponent )来启动应用。
import { NgModule } from '@angular/core' ;
import { BrowserModule } from '@angular/platform-browser' ;
import { AppComponent } from './app测试数据ponent' ;
@NgModule({
imports: [ BrowserModule ],
providers : [ Logger ], declarations : [ AppComponent ], exports : [ AppComponent ], bootstrap : [ AppComponent ]
}) export class AppModule { }
? NgModule 是一个装饰器函数，它接收一个用来描述模块属性的元数据对象。其中最重要的属性是：
declarations ?- 声明本模块中拥有的视图类。Angular 有三种视图类：组件、指令和管道。
exports ?- declarations 的子集，可用于其它模块的组件模板。
imports ?- 将js引入的素材模块或者组件模块等，进行angular模块化引用。
providers ?-?服务的创建者，并加入到全局服务列表中，可用于应用任何部分。
bootstrap ?- 指定应用的主视图（称为根组件），它是所有其它视图的宿主。只有根模块才能设置 bootstrap 属性。
2.ngClass 表达式包含/排除css类
<div [ngClass]="{active: isActive}"> // 例子1
<div [ngClass]=" {active: isActive,
shazam: isImportant} "> // 例子2
<div [class.active]="isActive"> // 例子3
在第一个例子中，如果 isActive 为真，则 active 类被应用到那个元素上。
还可以同时指定多个类，例如第二个例子。
Angular还有 类绑定 ，它是单独添加或移除一个类的好办法，就像第三个例子中展示的。
?
3.click 事件
<button (click)="toggleImage()"> // 例子1
<button (click)="toggleImage($event)"> // 例子2
Angular中要使用事件绑定，把目标事件的名字放在圆括号中，并且使用等号右侧引号中的模板语句对它赋值。 然后Angular为这个目标时间设置事件处理器。当事件被触发时，这个处理器就会执行模板语句。
在第一个例子中，当用户点击此按钮时，相关组件中的 toggleImage() 方法就被执行了。
第二个例子演示了如何传入 $event 对象，它为组件提供了此事件的详情。
4.Component装饰器
@Component({
selector: 'movie-list' ,
templateUrl: './movie-list测试数据ponent.html' ,
styleUrls: [ './movie-list测试数据ponent.css' ],
})
?
5.生命周期钩子
生命周期钩子其实就是生命周期函数，一般用在当我们调用服务获取数据的时候去使用的，例如当service.ts中有一个获取后台数据的接口，需要我们在组件构建到页面后就去获取后台数据。
有了生命周期函数，我们可以控制数据在什么时候去获取最合适。
1 import { Directive, OnInit, OnDestroy } from '@angular/core' ;
2
3 import { LoggerService } from './logger.service' ;
4
5 let nextId = 1 ;
6
7 @Directive({selector: '[mySpy]' })
8 export class SpyDirective implements OnInit, OnDestroy {
9
10 constructor(private logger: LoggerService) { }
11
12 ngOnInit() { this .logIt(`onInit`); }
13
14 ngOnDestroy() { this .logIt(`onDestroy`); }
15
16 private logIt(msg: string) {
17 this .logger.log(`Spy #${nextId++ } ${msg}`);
18 }
19 }
使用生命周期钩子的时候，需要注意的是:
1. ?export class SpyDirective implements OnInit, OnDestroy {...}? // 需要的生命周期钩子直接引入? implements ? 到后面即可，多个用逗号隔开;
2. ?在 ngOnInit、ngOnDestroy... 等方法中执行 service 中的函数即可。