لن يتم مناقشة فوائد حقن التبعية (DI) بعد الآن ، وأولئك الذين استخدموا إطار الربيع يعرفون ذلك. بصفته إطارًا في المقدمة ، يوفر AngularJS أيضًا الدعم لـ DI ، وهي ميزة لا تملكها JavaScript/JQuery. DI المتعلق بـ AngularJs تشمل Angular.Module () ، Angular.Injector () ، $ enjector ، و $ توفير. بالنسبة لحاوية DI ، يجب أن تحتوي على ثلاثة عناصر: تسجيل الخدمة ، وإعلان التبعية ، واكتساب الكائنات. على سبيل المثال ، في فصل الربيع ، يتم تنفيذ تسجيل الخدمة من خلال علامة <Nean> لملف تكوين XML أو التعليق التوضيحي @Repository و Service و Controller و Component ؛ يمكن تطبيق اكتساب الكائن بواسطة ApplicationContext.getBean () ؛ يمكن تكوين إعلان التبعيات في ملف XML ، أو يمكن إعلانه في رمز Java باستخدام Resource وغيرها من التعليقات التوضيحية. في الزاوي ، فإن الوحدة النمطية و $ معادلة لتسجيل الخدمة ؛ يتم استخدام الحاقن للحصول على كائنات (سوف يكمل الزاوي تلقائيًا حقن التبعيات) ؛ هناك 3 طرق لإعلان التبعيات في الزاوي. فيما يلي مقدمة عن Angular DI من هذه الجوانب الثلاثة.
1. Angular.Module () يخلق وحدات ويحصل عليها وسجلات في الزاوي
angular.module () هو مكان عالمي لإنشاء وتسجيل واستعادة الوحدات الزاوية. عند تمرير وسيطتين أو أكثر ، يتم إنشاء وحدة جديدة. إذا تم تمرير وسيطة واحدة فقط ، يتم استرداد الوحدة النمطية الموجودة (تم تمرير الاسم كوسيطة أولى إلى الوحدة النمطية).
// تمرير أكثر من معلمة واحدة يعني وحدة جديدة ؛ الصفيف الفارغ يعني أن الوحدة النمطية لا تعتمد على وحدات أخرى var createModule = Angular.module ("mymodule" ، []) ؛ تنبيه (createModule == getModule) ؛يمكن لهذه الوظيفة إنشاء وحدات جديدة أو الحصول على وحدات موجودة. سواء كنت ستنشئ أو الحصول عليها ، يتم تمييزها بعدد المعلمات.
angular.module (الاسم ، [يتطلب] ، [configfn]) ؛
الاسم: نوع السلسلة ، يمثل اسم الوحدة النمطية ؛
يتطلب: مجموعة من الأوتار ، تمثل قائمة الوحدات الأخرى التي تعتمد عليها الوحدة. إذا لم تعتمد على وحدات أخرى ، فاستخدم صفيفًا فارغًا ؛
configfn: يستخدم لإنشاء بعض التكوينات لهذه الوحدة.
الآن نحن نعرف كيفية إنشاء وحدات ، فما هي الوحدات النمطية بالضبط؟ لا يوجد سوى جملة واحدة على دليل المطور الرسمي: يمكنك التفكير في وحدة نمطية كحاوية للأجزاء المختلفة من وحدات تحكم التطبيق الخاصة بك ، وخدمات ، مرشحات ، توجيهات ، إلخ. لا أفهمها تمامًا الآن. وهذا يعني تقريبًا أن الوحدة النمطية عبارة عن مجموعة من بعض الوظائف ، مثل مجموعة كاملة من عناصر الأطفال مثل وحدات التحكم والخدمات والمرشحات والتعليمات ، وما إلى ذلك. لا يمكنني شرحها الآن ، لذلك سأتركها في البداية.
2. العلاقة بين توفير $ والوحدة النمطية
تحتوي خدمة توفير $ على عدد من الطرق لتسجيل المكونات مع $ jucjector. يتم كشف العديد من هذه الوظائف أيضًا على الزاوي.
كما ذكرنا سابقًا: يتم استخدام الوحدة النمطية والتوفير لتسجيل الخدمات في الحاقن. تحقق من واجهة برمجة التطبيقات الرسمية ويمكنك أن ترى أن توفير $ توفير توفير () ، ثابت () ، القيمة () ، المصنع () ، والخدمة () لإنشاء خدمات من مختلف الطبيعة ؛ Angular.Module توفر أيضًا طرق تسجيل الخدمة الخمسة هذه. في الواقع ، فإن وظائف الاثنين متشابهة تمامًا ، والتي يتم استخدامها لتسجيل الخدمات في حاوية DI في الحاقن.
يتضمن Auto تحت واجهة برمجة التطبيقات الرسمية توفير $ و $ upector ، وحدة ضمنية تتم إضافتها تلقائيًا إلى كل حاقن $. حرفيا ، كل حاقن لديه هذه الخدمات الضمنية. ولكن في الإصدار 1.2.25 ، أشعر أنه لا توجد طريقة للحصول على توفير $ في الحاقن. لا أعرف لماذا هذا؟ بشكل عام ، لا تحتاج إلى عرض هذه الخدمة ، فقط استخدم واجهة برمجة التطبيقات المتوفرة في الوحدة النمطية.
var enjector = Angular.Injector () ؛ Alert (enjector.has ("$ prode")) ؛3. Angular.Injector ()
يمكنك أيضًا الحصول على الحاقن باستخدام Angular.Injector () ؛ لكنها ليست مرتبطة بالوحدة. هذا النهج لا معنى له ، وهو ما يعادل إنشاء حاوية DI فارغة ، ولا توجد خدمة فيه ، كيف يمكن للآخرين استخدامه؟ الطريقة الصحيحة هي تحديد الوحدات النمطية التي تحتاج إلى تحميل عند إنشاء الحاقن.
// إنشاء وحدة mymodule وتسجيل خدمة var mymodule = Angular.module ('mymodule' ، []) ؛ mymodule.service ('myservice' ، function () {this.my = 0 ؛}) ؛ // إنشاء وحدة Hermodule وتسجيل خدمة var hermodule = jolular.module ('hermodule' ، []. function () {this.her = 1 ؛}) ؛ // تحميل خدمة var enjector = Angular.Injector (["mymodule" ، "hermodule"]) ؛ ALERT (enjector.get ("myService").إذا تم تحميل وحدات متعددة ، يمكن الحصول على الخدمات تحت وحدات متعددة من خلال الحاقن الذي تم إرجاعه. في هذا المثال ، إذا تم تحميل mymoudle فقط ، فلا يمكن للحقن الذي تم الحصول عليه الوصول إلى الخدمات تحت Hermoudle. من المهم بشكل خاص ملاحظة هنا: Angular.Injector () يمكن استدعاء عدة مرات ، وفي كل مرة تقوم بإرجاع كائن الحاقن الذي تم إنشاؤه حديثًا.
var enjector1 = Angular.Injector (["mymodule" ، "hermodule"]) ؛ var enjector2 = angular.injector (["mymodule" ، "hermodule"]) ؛ تنبيه (enjector1 == enjector2) ؛ // false
4. ثلاث طرق لإعلان التبعيات في الزاوية
يوفر Angular ثلاث طرق للحصول على تبعيات: الاستدلال ، والتعليق ، والأساليب المضمنة.
// إنشاء وحدة mymodule وتسجيل الخدمة var mymodule = Angular.module ('mymodule' ، []) ؛ mymodule.service ('myservice' ، function () {this.my = 0 ؛}) ؛ // get injectorvar juster = angular.injector ([["mymodule) InterferenceInjector.invoke (وظيفة (myService) {Alert (myservice.my) ؛}) ؛ // التعليقات التوضيحية الثانية الصريحة (servicea) {alert (servicea.my) ؛} ؛ explicit. $ enject = ['myservice'] ؛ inlineInjector.invoke (['myservice' ، function (servicea) {Alert (servicea.my) ؛}]) ؛من بينها ، لا تتطلب التعليقات التوضيحية والأساليب المضمنة اسم المعلمة الوظيفة ، وهو أمر يوصى به ؛ تتطلب طريقة الاستدلال أن يكون اسم المعلمة واسم الخدمة متسقة. إذا كان رمز JS مضغوطًا أو مضغوطًا ، فستكون هناك مشاكل في الوظيفة ، ولا ينصح بهذه الطريقة.
ما ورد أعلاه هو تجميع للمعلومات التي يتم حقنها من قبل angularjs التبعية. سنستمر في إضافة المعلومات ذات الصلة في المستقبل. شكرا لدعمكم لهذا الموقع!