حقن التبعية AngularJS
ما هو حقن التبعية
التفسير الخاص بـ WIKI هو: حقن التبعية (DI) هو نمط لتصميم البرامج حيث يتم حقن واحد أو أكثر من التبعيات (أو الخدمات) (أو تم تمريره بالرجوع) في كائن منفصل (أو عميل) ثم يصبح جزءًا من حالة العميل.
يفصل هذا النمط عن إنشاء سلوكيات تبعية العميل ، مما يجعل البرمجة مقترنة بشكل فضفاض ويتبع مبادئ انعكاس التبعية والمسؤولية الفردية. على النقيض المباشر من نمط محدد الموقع ، فإنه يسمح للعميل بفهم كيفية استخدام العميل للنظام للعثور على تبعيات
في كلمة واحدة-إذا لم يكن لديك ما تفعله ، فلا تأتي إلي ، سأذهب إليك إذا كان لديك شيء تفعله.
يوفر AngularJS آلية حقن التبعية الجيدة. يتم استخدام المكونات الأساسية الخمسة التالية كحقن التبعية:
قيمة
مصنع
خدمة
مزود
ثابت
قيمة
القيمة هي كائن JavaScript بسيط يقوم بتمرير القيم إلى وحدة التحكم (مرحلة التكوين):
var mainapp = Angular.module ("mainapp" ، []) ؛ // إنشاء كائن القيمة "DefaultInput" وقم بتمرير البيانات mainapp.value ("DefaultInput" ، 5) ؛ ... // enject "defaultInput" في وحدة التحكم mainapp.controller ('calccontroller' ، function ($ scope ، calcservice ، $ scope.result = calcservice.square ($ scope.number) ؛مصنع
المصنع هو وظيفة تُرجع قيمة. تم إنشاؤها عندما تتطلب الخدمة ووحدة التحكم.
عادة ما نستخدم وظائف المصنع لحساب أو إرجاع قيم.
// تحديد وحدة Var MainApp = Angular.module ("MainApp" ، []) ؛ // إنشاء مصنع "خدمة Mathservice" المستخدمة لضرب منتج اثنين من الرقمين mainapp.factory ('MathService' ، function () {var factory = {} ؛ factory.multiply = function (a ، b) {return a * b} // حقن المصنع "Mathservice" في الخدمة mainapp.service ('calcservice' ، الوظيفة (mathservice) {this.square = function (a) {return mathservice.multiply (a ، a) ؛}}) ؛ ...مزود
في AngularJS ، يتم إنشاء خدمة ، مصنع ، وما إلى ذلك من خلال الموفر (مرحلة التكوين).
يتم توفير طريقة المصنع GET () في المزود ، والذي يستخدم لإرجاع القيمة/الخدمة/المصنع.
// تحديد وحدة var var mainapp = Angular.module ("mainapp" ، []) ؛ ... // إنشاء خدمة باستخدام موفر تحديد طريقة لحساب منتج اثنين من الرقمين mainapp.config (function ($ provide) {$ provid. ب ؛ثابت
يتم استخدام ثابت (ثابت) لتمرير القيم الرقمية أثناء مرحلة التكوين. لاحظ أن هذا الثابت غير متوفر خلال مرحلة التكوين.
mainapp.constant ("conferenceparam" ، "قيمة ثابتة") ؛
مثال
توفر الأمثلة التالية عرضًا للعديد من آليات حقن التبعية.
<html> <head> <meta charset = "utf-8"> <title> angularjs حقن التبعية </title> </head> <body> <h2> angularjs تطبيق بسيط </h2> <div ng-app = "mainapp" ng-controller = "calccontroller"> <p> ng-click = "square ()"> x <sup> 2 </sup> </butting> <p> النتيجة: {{result}} </p> </viv> <script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js angular.module ("mainapp" ، []) ؛ mainapp.config (function ($ sevel) {$ prov.provider ('MathService' ، function () {this. $ get = function () {var factory = {} ؛ factory.multiply = function (a ، b) {return a * b ؛} factory ؛} ؛} ؛}) ؛}) ؛ }) ؛ MainApp.value ("DefaultInput" ، 5) ؛ mainapp.factory ('MathService' ، function () {var factory = {} ؛ factory.multiply = function (a ، b) {return a * b ؛} return factory ؛}) ؛ mainapp.service ('calcservice' ، function (mathservice) {this.square = function (a) {return mathservice.multiply (a ، a) ؛}}) ؛ mainapp.controller ('calccontroller' ، function ($ scope ، calcservice ، defaultInput) {$ scope.number = defaultInput ؛ $ scope.result = calcservice.square ($ scope.number) ؛ $ spect.square = function () {$ scope.result = calcservice.square ($) ؛ </script> </body> </html>نتائج التشغيل:
ما سبق هو فرز البيانات لحقن التبعيات AngularJS. سوف نستمر في إضافته لاحقًا. آمل أن يساعد ذلك الأصدقاء الذين يطورون AngularJS.