AngularJSのモジュール
- 24-07-2022
- Toanngo92
- 0 Comments
angleJsでは、モジュールは、コントローラー、サービス、フィルター、ディレクティブなど、angularJSの他のすべてのコンポーネント、またはモジュールを介して参照できるすべてのものを含むコンポーネントです。 angleJSでは、モジュールですべての機能を実行します。HTMLページにはモジュールが1つしかなく、このモジュールを使用してアプリケーションを初期化して起動できます。
以下の例を検討してください
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Example Module</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script> </head> <body ng-app="myApp"> </body> <script> var app = angular.module('myApp', []); console.log(app); </script> </html>
ブラウザコンソールにログインしたときの結果
上記のコードを分析します。
- 10行目:本文にはng-appという名前のhtml属性があり、内部の値は「myApp」です。これはディレクティブと呼ばれ、angularJSにこれがアプリケーションのモジュールであることを伝えます。スクリプトレイヤーの下でモジュールを初期化するときに、この名前「myApp」を渡して初期化します。
- 行番号14:var app = angle.module('myApp'、[]);ここでは、変数appを宣言し、angularオブジェクトの.module()メソッドからの戻り値に等しい値を割り当てます。このメソッドは2つのパラメーターを渡し、最初のパラメーターは文字列'myApp'であり、のng-appディレクティブ値と完全に一致します。 htmlタグ構造、この例の2番目のパラメーターは空の配列[]です。次の記事では、この配列に値を渡し、依存関係として概念化する方法について説明します。このコンテキストでは、依存関係を渡していないため、この配列は空であると宣言されます
- 15行目:アプリ変数をブラウザーに記録すると、このアプリ変数がオブジェクトであり、コントローラー、コンポーネント、フィルター、サービスなどの多くのメソッドが含まれていることがわかります…これらの概念は次の投稿でアプローチを続けます
少なくとも、現在の投稿までは、メインモジュールがangularJSの最大のオブジェクトであり、このオブジェクトがangularJSアプリケーションの他の子コンポーネントのコンテナーであることを理解しています。