APIが見つかりませんか?
AngularJSは機能のいくつかのカプセル化を提供しますが、グローバルオブジェクトAngularを介してこれらの関数にアクセスしようとすると、過去に遭遇したライブラリとは非常に異なることがわかります。
$ http
たとえば、jQueryでは、そのAPIがグローバルオブジェクト$を介して公開されていることがわかります。 Ajax呼び出しを行う必要がある場合は、$ .ajax()を使用してください。このようなAPIは、思考の期待と非常に一致しています。
AngularJSは、Ajaxコールもカプセル化し、$ HTTPオブジェクトを提供するグローバルオブジェクト:Angularも公開します。ただし、Angularにアクセスしようとすると、古いエクスペリエンスを使用して$ httpにアクセスしようとすると、そうではないことがわかります。
$ httpドキュメントを注意深く確認した後、手がかりが見つかりません。この$ httpはどこで入手できますか?
依存関係注射/DI
実際、AngularJSは依存関係の注入ですべての機能成分を整理します。
依存関係噴射モードでは、すべてのコンポーネントがコンテナを通過して互いにアクセスする必要があります。これにより、Angularjsでは中間を使用してコンポーネントのインスタンスオブジェクトを取得する必要があります。
var injector = angular.injector(['ng']); injector.invoke(function($ http){// dosth。with$ http});この中間は、依存関係噴射モードのコンテナです。 Angularjsでは、Injectorと呼ばれます。
→_→の例では、実際に関数である$ httpオブジェクトがあることがわかります。
インジェクター/インジェクター
インジェクターは、AngularJSフレームワークとアプリケーション開発の実装の鍵であり、DI/IOCコンテナの実装です。
Angularjsは機能をさまざまなタイプのコンポーネントに分割し、個別に実装します。これらのコンポーネントには、プロバイダー/プロバイダーという集団名があります。次の図には、Angularjsに一般的に使用されるいくつかの組み込みサービスがリストされています。
AngularJSコンポーネントは、互いに直接呼び出すことはできません。 1つのコンポーネントがインジェクターを通過して別のコンポーネントを呼び出す必要があります。この利点は、コンポーネントが互いに切り離され、オブジェクトのライフサイクル全体の管理がインジェクターにスローされることです。
インジェクターは2つの重要な機能を実装します。
すべてのプロバイダー向けにレシピを中央に保存します
レシピは実際には:name + classコンストラクターです。 AngularJSが開始されると、これらのプロバイダーは最初にレシピを使用してインジェクターに登録されます。たとえば、HTTPリクエストサービスコンポーネントは$ httpproviderクラス内にカプセル化されており、「$ http」という名前を介してインジェクターに登録されています。
オンデマンドで機能コンポーネントの例を提供します
ユーザーのコントローラーなどのその他のコンポーネントは、HTTP関数を使用する必要がある場合は、「$ http」という名前を使用してインジェクターを要求すると、HTTPサービスインスタンスを取得できます。
→_→のコードを変更して、$コンパイルサービスが何であるかを確認してみてください。
サービスコンポーネントを登録します
インジェクターの観点から見ると、コンポーネントは関数プロバイダーであるため、プロバイダー/プロバイダーと呼ばれます。 AngularJSでは、プロバイダーはJavaScriptクラス(コンストラクター)の形でカプセル化されています。
サービス名は通常、http通話サービスの「$ http」、ルートスコープオブジェクトの「$ rotscope」、「$ compile」などの文字列によって識別されます...
プロバイダークラスには、$ get関数(クラス工場)が必要です。この関数を呼び出すことにより、インジェクターはサービスコンポーネントのインスタンスを取得できます。
名前とクラス関数の組み合わせ情報は、レシピと呼ばれます。インジェクターは、一元化されたレシピライブラリを維持し、さまざまなコンポーネントをオンデマンドで作成します。このレシピライブラリは実際にはハッシュオブジェクトで、キーはサービス名、値はクラスの定義です。
→_→の例では、単純なサービスクラスを定義します。このサービスクラスのインスタンスは、「こんにちは、世界!」です。 「Ezhello」をサービス名として使用してインジェクターに登録し、インジェクターを介してこのインスタンスを表示します。
インジェクターオブジェクトを取得します
AngularJSの機能を使用するには、最初にインジェクターを取得する必要があります。インジェクターを取得するには2つの方法があります。
新しいインジェクターを作成します
angular.injector()を使用して新しいインジェクターを作成できます。
angular.injector(modules、[strictdi]);すでに作成されたインジェクターを取得します
AngularJSフレームワークが開始されている場合、DOMオブジェクトのIndector()メソッドを使用して、すでに作成されたインジェクターを取得できます。
var element = angular.element(dom_element);
var injector = element.injector();
インジェクターを介してAPIを呼び出します
インジェクターには、API呼び出しの2つのメソッドがあります:invoke()とget()。
invoke()
インジェクターのinvoke()メソッドを使用して、ユーザー定義の関数本文を直接呼び出して、関数パラメーターを介して従属サービスオブジェクトを挿入できます。これは、AngularJSの推奨と慣習の使用です。
angular.injector(['ng'])。得る()
インジェクターのget()メソッドを使用して、指定された名前でサービスインスタンスを取得することもできます。
var my $ http = angular.injector(['ng'])。get( '$ http'); // do sth。私の$ httpで
→_→例今回、get()メソッドを使用してサービスインスタンスを直接取得して感じました!
注入方法と原則
注入する必要があるサービスオブジェクトのインジェクターに通知する方法は2つあります。パラメーター名インジェクションと依存関係アレイインジェクション。
パラメーター名インジェクション
AngularJSがInvoke()関数を実行すると、関数定義を文字列に注入するように変換し、正規表現を介してパラメーターテーブルをチェックするため、以下に依存するサービスオブジェクトを発見して注入します。
// myfuncは、この関数が「$ http」サービスvar myfunc = function($ http)に依存すると宣言しています。{// do sth。 $ http}; injector.invoke(myfunc); // myfuncの定義は、パラメーター名のチェックのために文字列に変換されます。これには問題があります。つまり、JavaScriptコードを圧縮すると、$ httpが別の名前に変更される場合があります。これにより、注入が失敗します。
アレイインジェクションに依存します
AngularJSは、依存関係アレイメソッドを使用して、コード圧縮の難読化によって引き起こされる問題を解決します。この時点で、Invoke()は配列に渡されます。配列の最後の項目は実際に実行される関数であり、他のアイテムは関数に注入する必要があるサービス名を示します。インジェクターは、配列内の順序で関数に従属オブジェクトを挿入します。
この方法では、注入するパラメーターテーブルの名前は無関係です。
// myfuncは「$ http」および「$ compile」サービスvar myfunc = ['$ http'、 '$ compile'、function(p1、p2){// do sthに依存します。 p1($ http)、p2($ compile)}]; injector.invoke(myfunc);→_→のインスタンスには、配列依存的な方法が注入されます。今回は、Ezhelloサービスインスタンスが注入されます。パラメーター名を変更して、結果に影響するかどうかを確認できますか?
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。