Module
简单来说模块（module）就是完成共同目的的代码块，export一些内容例如一个类、函数、或值变量。
component就是一个基本的Angular块，一个component类其实也是我们从模块中export出来的东西。
Angular本身也是一个有着许多称为“barrels”的库模块的集合。angular2/core 是最主要的Angular库模块。
如果引入的是Angular本身的库模块，import语句直接引用的是模块的名称；如果引入的是自己本地的模块，则需要使用相对路径，例如同一个目录下使用前缀(./)。
import {Component} from ‘angular2/core‘; // angular的模块
import {AppComponent} from ‘./app.component‘; // 自己写的本地模块
Component
组件（Component）控制屏幕实际使用面积的一小块（我们称之为视图的一小块）。简单来说组件完成一些事情来支撑视图（在一个类里），这个类通过属性和方法的API与视图相互作用。
export class HeroListComponent implements OnInit {
constructor(private _service: HeroService){ }
heroes:Hero[];
selectedHero: Hero;
ngOnInit(){
this.heroes = this._service.getHeroes();
}
selectHero(hero: Hero) { this.selectedHero = hero; }
}
Template
模板（Template）是用于定义组件的视图，通过HTML来告诉Angular怎样来渲染这个组件。
<h2>Hero List</h2>
<p><i>Pick a hero from the list</i></p>
<div *ngFor="#hero of heroes" (click)="selectHero(hero)">
{{hero.name}}
</div>
<hero-detail *ngIf="selectedHero" [hero]="selectedHero"></hero-detail>
<hero-detail>是自定义的标签，代表的是HeroDetailComponent，在写Angular模板的时候，将自定义标签和原有标签混合是很常见的。
Metadata
@Component({
selector: ‘hero-list‘,
templateUrl: ‘app/hero-list.component.html‘,
directives: [HeroDetailComponent],
providers: [HeroService]
})
export class HeroListComponent implements OnInit { ... }
通过将metadata附加在类上，来告诉angular：HeroListComponent是一个组件。
通过“@decorator”来添加metadata是Typescript中最简单的方式。“@decorator”是个函数，有其配置参数。
Component metadata的文档：https://angular.io/docs/ts/latest/api/core/ComponentMetadata-class.html
Data Binding
数据绑定是一种统筹模板和组件的机制，我们在模板HTML中增加双花括号等其他标记来告诉Angular怎样连接组件和模板两边。
<div>{{hero.name}}</div>
<hero-detail [hero]="selectedHero"></hero-detail>
<div (click)="selectHero(hero)"></div>
第一行代码：{{hero.name}}是插入（interpolation），将组件的属性hero.name显示在div中。
第二行代码：[hero]是属性绑定（property binding），将父组件的selectedHero属性传给子组件的hero属性。
第三行代码：(click)是事件绑定（event binding），当用户点击时，调用组件的selectHero方法。
<input [(ngModel)]="hero.name">
双向数据绑定：使用ngModel命令，属性值会从组件传送到input框中，同时用户改变input框的值时也会传送回组件，重设组件的属性值（和事件绑定类似）。
Directive
Angular渲染模板的时候，根据给定的命令（directive）来将模板转换成DOM。
命令分为两种：结构（structural）命令和属性（Attribute）命令。通常在标签中出现（在等号的左边）。
<div *ngFor="#hero of heroes"></div> <hero-detail *ngIf="selectedHero"></hero-detail>
上面的ngFor、ngIf就是两个结构命令，它们可以增加、删除DOM中的元素。
<input [(ngModel)]="hero.name">
ngModel是其中一种属性命令，属性命令改变元素的外观和行为。
Service
服务（Service）囊括的范围很大，任何对我们的应用起到作用的值、函数或特性都能成为service，常见的有：
- logging service
- data service
- message bus
- tax calculator
- application configuration
// app/logger.service.ts (class only)
export class Logger {
log(msg: any) { console.log(msg); }
error(msg: any) { console.error(msg); }
warn(msg: any) { console.warn(msg); }
}
上面是一个service类的例子，作用是简单地在浏览器中log一些信息。
组件通常不直接完成一些工作，而是通过service来完成，例如从数据库获取数据、验证用户输入等等。它只维护属性和set|get这些属性的方法（为了数据绑定），而其他工作都交给service。
Dependency Injection
依赖注入（Dependency Injection）是在一个类中产生一个的新的实例的途径，这个实例是它require的依赖的实例。大多数的依赖都是service。
简单来说，Angular通过依赖注入来给组件提供它们需要的service。
// app/hero-list.component (constructor)
constructor(private _service: HeroService){ }
在TypeScript中，Angular通过构造函数的参数，从而知道要提供什么service给组件。以上面为例，HeroListComponent的构造函数表明需要的是HeroService。
Injector维护一个service实例的容器，如果需要的service实例（需要是指在Component Metadata中的providers字段声明？这样就能解释只有父组件声明的话，子组件会和父组件共享一个实例的现象）不在容器里，Injector会增加进它的容器里，当所有需要的service实例都在之后，Angular可以开始调用组件的构造函数。这就是依赖注入的过程。