Angular4-module

提供:Dev Guides
移動先:案内検索

Angular 4-モジュール

Angularの Module は、アプリケーションに関連するコンポーネント、ディレクティブ、パイプ、およびサービスをグループ化できる場所を指します。

Webサイトを開発している場合、ヘッダー、フッター、左、中央、および右のセクションがモジュールの一部になります。

モジュールを定義するには、 NgModule を使用できます。 Angular –cliコマンドを使用して新しいプロジェクトを作成すると、ngmoduleはデフォルトでapp.module.tsファイルに作成され、次のようになります-

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

@NgModule({
   declarations: [
      AppComponent
   ],
   imports: [
      BrowserModule
   ],
   providers: [],
   bootstrap: [AppComponent]
})

export class AppModule { }

NgModuleは次のようにインポートする必要があります-

import { NgModule } from '@angular/core';

ngmoduleの構造は以下に示すとおりです-

@NgModule({
   declarations: [
      AppComponent
   ],
   imports: [
      BrowserModule
   ],
   providers: [],
   bootstrap: [AppComponent]
})
*@ NgModule* で始まり、宣言、インポート、プロバイダー、およびブートストラップを持つオブジェクトが含まれています。

宣言

作成されたコンポーネントの配列です。 新しいコンポーネントが作成された場合、最初にインポートされ、以下に示すように参照が宣言に含まれます-

declarations: [
   AppComponent,
   NewCmpComponent
]

インポート

これは、アプリケーションで使用する必要があるモジュールの配列です。 また、宣言配列内のコンポーネントで使用することもできます。 たとえば、現在@NgModuleには、インポートされたブラウザモジュールがあります。 アプリケーションにフォームが必要な場合は、次のようにモジュールを含めることができます-

import { FormsModule } from '@angular/forms';
*@ NgModule* でのインポートは次のようになります-
imports: [
   BrowserModule,
   FormsModule
]

プロバイダ

これには、作成されたサービスが含まれます。

ブートストラップ

これには、実行を開始するためのメインアプリコンポーネントが含まれます。