「コンポーネント」と「モジュール」とは（2）
実装をグループ化する「モジュール」
モジュールは、機能単位やコードの関連性など任意のルールで、コンポーネントなどの実装をグループ化したものです。Angular 2自身も分割された多数のモジュールで構成されており、プログラマーは必要なモジュールをインポートして使います。また、プログラマーが自分でモジュールを定義することもできます。
Angular 2で作成するWebページは、自身のモジュールを少なくとも1個含む必要があり、これをルートモジュールと呼びます（ソースコード上ではAppModuleという名前が慣用的に使われます）。クイックスタートではapp/app.module.tsにルートモジュールが定義されています。
// Angular 2のモジュール参照 ...（1）
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
// AppComponentの参照 ...（2）
import { AppComponent } from './app.component';
// モジュールのメタデータ ...（3）
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
// モジュールクラス ...（4）
export class AppModule { }
（1）、（2）のimportは、他のコンポーネントやモジュールを参照して取り込む記述です。「import {A} from X」と記述すると、XというコンポーネントやモジュールからAという機能を参照します。（1）の「@angular/xxx」はAngular 2が提供するモジュールで、必要とする機能に応じてxxxの部分を指定します。また（2）の「./app.component」のように自作のTypeScriptファイルも指定できます（拡張子は除く）。
（1）で参照しているNgModuleはルートモジュールを定義する処理を含むモジュール、BrowserModuleはWebページをWebブラウザーで実行するための処理を含むモジュールです。（2）では、app.component.tsからルートモジュールに含めるAppComponentコンポーネントを参照しています。これらを用いて、（3）の@NgModuleデコレーターでモジュールのメタデータを指定しています。（4）はモジュールの実体クラスで、他のモジュールから参照するときにこのクラス名（AppModule）を指定します。
@NgModuleデコレーターの主なパラメーターとその意味を表1に示します。bootstrapに指定する「ルートコンポーネント」は、Webページの最上位に表示され、他のすべてのコンポーネントを含むコンポーネントで、ルートモジュールに対して必ず指定します。
| パラメーター | 意味 |
|---|---|
| imports | モジュールが内部で利用する他のモジュールなど |
| exports | モジュールが外部に公開する他のコンポーネントなど |
| declarations | モジュールに含まれるコンポーネントクラス |
| bootstrap | ルートコンポーネント |
つまり、リスト2（3）は「BrowserModuleを利用して」、「AppComponentを含み」、「AppComponentを最上位に指定する」ことを表します。クイックスタートプロジェクトにはルートモジュールしかモジュールが存在しないため、exports属性は利用しません。exports属性の利用法は、次回記事で説明します。
ルートモジュールの起動
ルートモジュールを起動する処理はapp/main.tsに記述されます。ブラウザーで起動する機能を持つplatformBrowserDynamicのbootstrapModuleメソッドに、リスト2で定義したルートモジュールAppModuleを指定して起動させます。
// ブラウザーで起動する機能
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
// Webページのルートモジュール
import { AppModule } from './app.module';
// ルートモジュールを起動
const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule);
Angular 2のページは少なくとも1つのルートモジュールを持ち、ルートモジュールは1個以上のコンポーネントを含み、そのうち1個はルートコンポーネントである必要があります。この関係を整理すると図2のようになります。
