AngularJSモジュールについて話す前に、最初にAngularの知識ポイントを紹介しましょう。
AngularJSは純粋なクライアントテクノロジーであり、JavaScriptで完全に書かれています。 Web開発の従来のテクノロジー（HTML、CSS、JavaScript）を使用して、Webアプリケーション開発をより迅速かつ容易にします。
AngularJSは、アプリケーション開発を簡素化することです。一般的な低レベルの開発操作をパッケージ化して、開発者に提供します。 AngularJSは、これらの低レベル操作を自動的に処理します。それらは次のとおりです：
1.DOM操作
2。イベントのリスニングを設定します
3.入力検証AngularJSはこれらの操作のほとんどを処理するため、開発者はアプリケーションのビジネスロジックにもっと集中し、繰り返し、エラーが発生しやすい、低レベルのコードを書き込むことができます。
AngularJSは開発を簡素化していますが、以下を含むいくつかの絶妙なテクノロジーもクライアントにもたらします。
1。データ、ビジネスロジック、およびビューの分離
2。データとビューの自動結合
3。一般サービス
4。依存関係注射（主に集約サービスに使用）
5。拡張可能なHTMLコンパイラ（JavaScriptによって完全に書かれています）
6.テストしやすい
7.これらのテクノロジーに対するクライアントの要求は、実際に長い間存在してきました。
同時に、AngularJを使用してシングルページまたはマルチページアプリケーションを開発することもできますが、主に単一ページアプリケーションの開発に使用されます。 AngularJSは、ブラウザの履歴オペレーション、フォワードボタンとバックボタン、および単一ページアプリケーションでのお気に入りの操作をサポートしています。
次に、Angularjsのモジュールを詳細に説明しましょう。
ほとんどのアプリケーションには、アプリケーションをインスタンス化、整理、起動するための主要な方法があります。 AngularJSアプリケーションには主要な方法はありませんが、モジュールを使用してアプリケーションの開始方法を宣言します。この方法には次の利点があります。
1.スタートアッププロセスは宣言的であるため、理解しやすいです。
2。単体テストでは、すべてのモジュールをロードする必要はないため、この方法はユニットテストの書き込みに役立ちます。
3.特定の状況では、追加のモジュールをテストに追加できます。これらのモジュールは構成を変更でき、エンドツーエンドのテストに役立ちます。
4.サードパーティコードは、再利用可能なモジュールにパッケージ化できます。
5.モジュールは、シーケンスまたは並列性の任意の順序でロードできます（モジュール自体の実行が遅れているため）。
例えば：
<！doctype html> <html ng-app = "myapp"> <head> <script src = "http://code.angularjs.org/angular-1.0.2.min.js"> </script> <script> var myappmodule = angular.module（ 'myapp'、[]）; //モジュールを構成します。 //この例では、グリーティングフィルターmyAppModule.filter（ 'Greet'、function（）{return function（name）{return 'hello、' + name + '！';};}）を作成します。 </script> </head> <body> <div> {{'world' | Greet}} </div> </body> </html>上記の例では、myAppモジュールを使用して、アプリケーションを<html ng-app = "myApp">で指定して開始します。
上記の例は非常に簡単ですが、同じ方法で大規模なアプリケーションを作成するのに適していません。私たちの推奨事項は、アプリケーションを次のモジュールに分割することです。
1.サービス宣言を行うために使用されるサービスモジュール。
2。命令宣言を作成するために使用される命令モジュール。
3.フィルター宣言を作成するために使用されるフィルターモジュール。
4.初期化コードを含む上記のモジュールに依存するアプリケーションレベルのモジュール。
例えば：
<！doctype html> <html ng-app = "xmpl"> <head> <script src = "http://code.angularjs.org/angular-1.0.2.min.js"> </script> <script src = "script.js"> </script {{グリーティング}}！ </div> </body> </html> [/code] script.js：[code] angular.module（ 'xmpl.service'、[]）。 //サービスモジュール値（ 'Greeter'、{// Custom Greeter Object Salution： 'hello'、locialize：function（locialization）{this.salutation = locialization.salution;}、greet：function（name）{return this.salution + '' + name + ';}}）。 value（ 'user'、{//カスタムユーザーオブジェクトロード：function（name）{this.name = name;}}）; angular.module（ 'xmpl.directive'、[]）; //命令モジュールangular.module（ 'xmpl.filter'、[]）; //フィルターモジュールAngular.module（ 'xmpl'、['xmpl.service'、 'xmpl.directive'、 'xmpl.filter']）。 //モジュールXmplは、配列のモジュール実行（function（greeter、user）{//コードの初期化。アプリケーションが起動したとき、greeter.localize（{nolution： 'bonjour'}）; user.load（ 'world'）;}）// appvar xmplonollerer = scope、scope、scope、scope、scope、scope、scope、scope、scope、scope、ユーザーGreeter.Greet（user.name）;}この分割の理由は、テストの初期化コードを無視する必要があることが多いためです。これらのコードはテストがより困難であるためです。分割することで、テストで簡単に無視できます。このテストは、現在のテストに関連するモジュールのみをロードすることにより、より具体的にすることもできます。上記は単なる提案です。特定の状況に応じて調整するために安心できます。
モジュールは、スタートアップ段階でアプリケーションに接続されている一連の構成とコードブロックのコレクションです。最も単純なモジュールは、2セットのコードブロックで構成されています。
構成コードブロック - 注入プロバイダーのインジェクションと構成フェーズ中に実行します。注入プロバイダーと定数のみを構成ブロックに注入できます。これは、サービスが構成される前に事前に初期化されないようにするためです。
コードブロックを実行する - インジェクターが作成された後に実行され、アプリケーションを起動するために使用されます。インスタンスと定数のみを実行ブロックに注入できます。これは、システム構成が操作後に発生しないようにするためです。
コード実装：
Angular.module（ 'mymodule'、[]）。 config（function（injectables）{// provider-injector configコードブロック//これは構成ブロックの例です。 run（function（injectables）{// instance-injector config code block //これは実行ブロックの例です。モジュールには設定する簡単な方法もいくつかあり、それらを使用することはコードブロックの使用と同等です。例えば：
Angular.module（ 'mymodule'、[]）。値（ 'A'、123）。 Factory（ 'a'、function（）{return 123;}）。ディレクティブ（ 'directivename'、...）。 filter（ 'filtername'、...）; //は同じasangular.module（ 'mymodule'、[]）です。 config（function（$ sultion、$ compileprovider、$ filterprovider）{$ sultion.value（ 'a'、123）$ detwory（ 'a'、function（）{return 123;}）$ compileprovider.directive（ 'directivename'、...）。$ filterprovider.register（ 'filtername'、...）;構成ブロックは、$ sultion、$ compileprovider、$ filterprovider、および$ filterproviderの登録順に適用されます。唯一の例外は、構成ブロックの先頭に常に配置する必要がある定数の定義です。
ランニングブロックは、AngularJSの主要な方法に最も似ています。実行ブロックは、アプリケーションを開始するために使用されるコードです。すべてのサービスが構成され、すべてのインジェクターが作成された後に実行されます。実行中のブロックには通常、テストが困難なコードが含まれているため、単位テスト中に無視できるように、個別のモジュールで記述する必要があります。
モジュールは、他のモジュールをその依存関係としてリストできます。 「特定のモジュールに依存する」とは、モジュールの前に従属モジュールをロードする必要があることを意味します。つまり、このモジュールの構成ブロックの前に、従属モジュールの構成ブロックが実行されます。同じことがブロックを実行することにも当てはまります。複数のモジュールに依存している場合でも、モジュールは一度しかロードできません。
モジュールは、$ injector構成を管理するために使用される方法であり、スクリプトの読み込みとは何の関係もありません。インターネットに制御モジュールをロードするためのライブラリがたくさんあり、AngularJSで使用できます。モジュールはロード中に何もしないため、任意の順序または並行してロードできます