Angularにおけるコンポーネントアプローチ入門

例として、あるウェブサイトがあるとしましょう。このサイトでは、 いくつかのブロックを識別できます：ヘッダー、 コンテンツ、サイドバー、フッターなどです。各 ブロックは、さらに小さなサブブロックに分割できます。 例えば、ヘッダーには通常、ロゴ、 メニュー、連絡先ブロックなどを識別できます。

Angularでは、そのような各ブロックは コンポーネントと呼ばれます。各コンポーネントは、 その中により小さなコンポーネントを含むことができ、 それらはさらに小さなコンポーネントを含むことができ、 というように続きます。

Angularの各コンポーネントは、 srcフォルダ内に配置された、 ファイルを含むフォルダに対応します。

コンポーネントの1つはメインである必要があります - 他のコンポーネントが追加されるコンポーネントです。 Angularでは、デフォルトでそのような コンポーネントはAppコンポーネントになります。この コンポーネントに他のコンポーネントが接続されます。 これがどのように行われるかについては、このチュートリアルの後半で説明します。