يعد التوجيه جانبًا مهمًا يجب مراعاته أثناء إنشاء تطبيقات من صفحة واحدة باستخدام . في هذه المقالة ، سوف نتعرف على مفهوم التوجيه باستخدام جهاز التوجيه UI وانظر كيف يعمل مقدم الحالة في AngularJS بالتسلسل التالي:
طرق استخدام Stateprovider في AngularJS
يتم استخدام stateProvider $ لتعريف حالات مختلفة لمسار واحد. يمكنك إعطاء الدولة اسمًا ، ووحدة تحكم مختلفة ، ووجهة نظر مختلفة دون الحاجة إلى استخدام عنوان مباشر href إلى طريق. هناك طرق مختلفة تستخدم مفهوم $ stateprovider في .
لذا ، دعونا ننتقل ونناقش الطرق المختلفة.
جهاز التوجيه AngularUI
UI-Router هو توجيه بناها فريق AngularUI لصالح AngularJS. يتم استخدامه لإنشاء طرق لـ ويوفر نهجًا مختلفًا عن ngRoute. جهاز التوجيه UI يتميز بميزات إضافية ويثبت أنه أكثر ملاءمة للمشاريع والتطبيقات المعقدة.
بدء المشروع
في هذه الخطوة ، نقوم بتضمين الملفات الزاوية في الرأس.
... ... // قائمة الإبحار// المحتوى
المنطق الرئيسي لتطبيقنا موجود في app.js :
var app = angular.module ('angularRoutingEx'، ['ui.router'])التوجيه
لإدارة التوجيه ، نحتاج إلى إضافة $ stateProvider. في الكود الوارد أدناه ، يتم عرض التوجيه بين الصفحة الرئيسية وصفحة المعلومات.
java تحويل ثنائي إلى عشري
// app.js app.config (الوظيفة ($ stateProvider، $ urlRouterProvider) {var States = [{name: 'main'، url: '/'، template: ''، controller: function ($ range، $ stateParams) {$ range.paramId = $ stateParams.id}}] States.forEach ((state) => $ stateProvider.state (state)) $ urlRouterProvider.otherwise ('/')})هذه بعض المفاهيم التي تستخدم $ stateProvider. مع هذا ، وصلنا إلى نهاية مقالتنا.
جتحقق من من Edureka ، شركة تعليمية موثوقة عبر الإنترنت مع شبكة تضم أكثر من 250.000 متعلم راضٍ منتشرين في جميع أنحاء العالم Angular هو إطار عمل JavaScript يُستخدم لإنشاء تطبيقات ويب قابلة للتطوير ومؤسسة وأداء من جانب العميل. مع اعتماد إطار العمل الزاوي عاليًا ، فإن إدارة أداء التطبيق مدفوعة بالمجتمع بشكل غير مباشر يقود فرص عمل أفضل يهدف تدريب الشهادة الزاوي إلى تغطية كل هذه المفاهيم الجديدة حول تطوير تطبيقات المؤسسة.
لديك سؤال لنا؟ يرجى ذكر ذلك في قسم التعليقات في مدونة 'Stateprovider in AngularJS' وسنقوم بالرد عليك.