Angular 6-モジュール

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
]

プロバイダ

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

ブートストラップ

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

Angular6-module

Angular 6-モジュール

宣言

インポート

プロバイダ

ブートストラップ

目次