اندازهی قلم متن
تخمین مدت زمان مطالعهی مطلب:
دو دقیقه
در این مقاله شما را با روشی آشنا خواهم کرد که در عین سادگی، کارآیی زیادی در پروژههای AngularJS خواهد داشت.
در پروژههای بزرگ که تعداد Controllerها بیش از حد میباشد همیشه تعدادی Injection مشترک وجود دارد و مدیریت این Injectionها در همه کنترلها و مخصوصا کنترلهای جدید که به پروژه اضافه میکنیم سخت میشود و گاهی از نظم خارج میشود مخصوصا وقتی که تعداد Developerها در پروژه زیاد باشند.
با استفاده از تابع زیر مابقی Injectionهای مختص هر Controller را پیاده سازی میکنیم.
توضیح تابع: در خط اول یک Copy از آرایه را تهیه میکنیم تا در دفعات بعد هم این آرایه قابل استفاده باشد. arguments در داخل تابع به رشته Injectionهای ارسال شده به تابع و تابع Controller اشاره دارد. با این روش میتوانیم به صورت نامحدود Injectionها را به تابع ارسال کنیم. در داخل حلقه به Copy متغیر injection همه Injectionهای ارسالی به تابع را push میکنیم. نهایتا این تابع آرایهای از injectionهای مشترک و Injectionهای مختص هر Controller و خود تابع Controller را بر میگرداند.
همانطور که مشاهده کردید، با این روش خیلی راحتتر میتوانید Injectionهای مشترک را مدیریت کنید. اگر قرار باشد Injection جدیدی را به همه Controllerها اضافه کنید، کافیست آن را در آرایه injection درج کنید.
برای همه ما پیش آماده است که خیلی از Injectionهای Controllerهای AngularJS به صورت مشترک بوده ولی مجبور شدهایم این Injectionها را در هر Controller تکرار کنیم. کدهای زیر را مشاهده کنید. در این کد یک سری از injectionها به صورت مشترک در این ۴ Controller تکرار شده است.
app.controller('ctrl1',['$scope','$rootscope','$location','$route','api','delete','notify',ctrl1]); ... app.controller('ctrl2',['$scope','$rootscope','$location','$route','api','delete','notify','chart',ctrl2]); ... app.controller('ctrl3',['$scope','$rootscope','$location','$route','api','delete','notify','pulling',ctrl3]); ... app.controller('ctrl4',['$scope','$rootscope','$location','$route','api','delete','notify','chart','report',ctrl4]);
در این روش که نوعی Trick ساده Javascript هست به شما در مدیریت Injectionها کمک میکند.
خوب ابتدا همه Injectionهای مشترک Controllerها را شناسایی میکنیم و یه آرایه تعریف میکنیم و همه Injectionهای مشترک را مرتب در این آرایه قرار میدهیم.
var injection=['$scope','$rootscope','$location','$route','api','delete','notify'];
function injectionHandle() { var _injection=angular.copy(injection); for(var i=0;i<arguments.length;i++){ _injection.push(arguments[i]); } return _injection; }
در مرحله بعدی در تعریف Controllerها تابع injectionHandle را همراه با Injectionهای مختص آن Controller را صدا میزنیم.
در کد زیر نحوه استفاده از این روش را مشاهده میکنید:
app.controller('ctrl1', injectionHandle(ctrl1)); ... app.controller('ctrl2', injectionHandle('chart',ctrl2)); ... app.controller('ctrl3', injectionHandle('pulling',ctrl3)); ... app.controller('ctrl4', injectionHandle('chart','report',ctrl4));