javascript - ما الفرق بين التوجيه الزاوي والموجه الزاوي-ii؟




angularjs angularjs-routing (10)

ngRoute هو وحدة جوهرية الزاوي وهو جيد للسيناريوهات الأساسية. أعتقد أنهم سيضيفون ميزات أكثر قوة في الإصدارات القادمة.

عنوان URL: https://docs.angularjs.org/api/ngRoute

Ui- الموجه هو الوحدة التي ساهمت في التغلب على مشاكل ngRoute. أساسا متداخلة / معقدة وجهات النظر.

عنوان URL: ui-router

بعض الفرق بين واجهة المستخدم وراوتر ngRoute

http://www.amasik.com/angularjs-ngroute-vs-ui-router/

أخطط لاستخدام AngularJS في تطبيقاتي الكبيرة. لذلك أنا في عملية لاكتشاف الوحدات النمطية الصحيحة لاستخدام.

ما هو الفرق بين ngRoute (angular-route.js) ووحدات الموجه ui-router (angular-ui-router.js) ؟

في العديد من المقالات عند استخدام ngRoute ، يتم تكوين المسار مع $ routeProvider . ومع ذلك ، عند استخدامه مع ui-router ، يتم تكوين المسار باستخدام $ stateProvider و $ urlRouterProvider .

ما هي الوحدة النمطية التي يجب استخدامها لتحسين الإدارة وقابلية التمدد؟


1- تم تطوير ngRoute بواسطة فريق زاوي ، بينما ui-router هو وحدة طرف ثالث. 2- يقوم ngRoute بتنفيذ التوجيه على أساس عنوان URL للطريق بينما يقوم موجه واجهة المستخدم بتنفيذ التوجيه بناءً على حالة التطبيق. 3-ui-router يوفر كل ما يوفره ng-route بالإضافة إلى بعض الميزات الإضافية مثل الحالات المتداخلة والعديد من طرق العرض المسماة.


ngRoute هو جزء من إطار AngularJS الأساسية.

ui-router هي مكتبة مجتمعية تم إنشاؤها لمحاولة تحسين قدرات التوجيه الافتراضية.

في ما يلي مقالة جيدة حول تهيئة / إعداد واجهة المستخدم لجهاز التوجيه:

http://www.ng-newsletter.com/posts/angular-ui-router.html


ngRoute هو وحدة بنيت من قبل فريق Angular الذي يوفر وظائف التوجيه الأساسية من جانب العميل. توفر هذه الوحدة قاعدة قوية إلى حد كبير للتوجيه ، ويمكن البناء عليها بسهولة لإعطاء وظيفة التوجيه الصلبة ، كما هو موضح في هذا المنشور المدون (تأكد من قراءة تعليق التعليق بين وارد بيل وبن نادل ، المؤلف - إنهما زوجين من الايجابيات الزاوي)

يحول ui-router التركيز من المسارات التي تتمحور حول عنوان url إلى "الحالات" التطبيقية ، والتي قد تنعكس أو لا تنعكس في عنوان url.

تعتبر الميزات الأساسية التي تمت إضافتها بواسطة ui-router حالات متداخلة وطرق عرض مسماة.

تسمح لك الحالات المتداخلة بفصل منطق جهاز التحكم عن الأجزاء المختلفة من التطبيق. من الأمثلة البسيطة على ذلك التطبيق الذي يستخدم التنقل الأساسي عبر الجزء العلوي ، وقائمة ملاحة ثانوية على الجانب الأيمن ، ومحتوى على اليمين. بدون الحالات المتداخلة ، يجب على وحدة التحكم الواحدة أن تتعامل مع المنطق العرضي للملاحة الثانوية بالإضافة إلى المحتوى. يتيح لك التوجيه المتداخل فصل هذه المخاوف.

وجهات النظر المسماة هي ميزة إضافية أخرى من واجهة المستخدم التوجيه. مع ngRoute ، يمكنك فقط الحصول على توجيه ngView واحد على الصفحة ، بينما مع طرق العرض المسماة في ui-router يمكنك تحديد توجيهات متعددة لواجهة المستخدم ، ومن ثم تستطيع كل حالة أن تؤثر على القالب والتحكم في طرق عرض الأسماء. ومن الأمثلة الفريدة البسيطة على ذلك أن يكون المحتوى الرئيسي لتطبيقك هو العرض الأساسي ، ثم أن يكون له أيضًا شريط تذييل يمكن أن يكون واجهة مستخدم منفصلة. في هذا السيناريو ، لم تعد وحدة التحكم في footer تستمع إلى تغييرات الولاية / المسار.

يمكن العثور على مقارنة جيدة بين ngRoute و ui-router على حلقة البودكاست هذه .

فقط لجعل الأمور أكثر إرباكًا ، تابع عينيك على وحدة التوجيه "الرسمية" الجديدة التي يتوقع فريق Angular إصدارها للإصدارات 1.5 و 2.0 من Angular. سيحل هذا محل وحدة ngRoute. Here التوثيق الحالي لوحدة الموجه الجديدة - وهو متناثر إلى حد ما اعتبارًا من هذا النشر نظرًا لأن التنفيذ لم يتم الانتهاء منه بعد. شاهد here لمزيد من الأخبار حول متى سيتم إصدار هذه الوحدة بالفعل.


ngRoute هي مكتبة توجيه أساسية ، حيث يمكنك تحديد وجهة نظر وتحكم واحد فقط لأي مسار.

باستخدام ui-router ، يمكنك تحديد طرق عرض متعددة ، متوازية ومتداخلة. لذلك إذا كان التطبيق الخاص بك يتطلب (أو قد يتطلب ذلك في المستقبل) أي نوع من التوجيه / طرق معقدة ، ثم المضي قدما في جهاز التوجيه واجهة المستخدم.

http://www.ng-newsletter.com/posts/angular-ui-router.html هو أفضل دليل للبدء في AngularUI Router.


إذا كنت ترغب في الاستفادة من وظائف العروض المتداخلة التي تم تنفيذها في إطار ngRoute paradigm ، فجرّب angular-route-segment.com - فهو يهدف إلى توسيع ngRoute بدلاً من استبداله.


واجهة المستخدم التوجيه تجعل حياتك أسهل! يمكنك إضافته إلى تطبيق AngularJS عن طريق إدخاله في تطبيقاتك ...

يأتي ng-route كجزء من قلب AngularJS ، لذلك فهو أبسط ويعطيك خيارات أقل ...

انظر هنا لفهم مسار ng بشكل أفضل: https://docs.angularjs.org/api/ngRoute

أيضًا عند استخدامه ، لا تنس استخدام: ngView ..

يختلف ng-ui-router ولكن:

ui-router ولكنه يمنحك المزيد من الخيارات ....


يعمل عادةً جهاز التوجيه واجهة المستخدم على آلية الحالة ... يمكن فهمه مع مثال سهل:

لنفترض أن لدينا تطبيقًا كبيرًا لمكتبة موسيقية (مثل ..gaana أو saavan أو أي موقع آخر). وفي أسفل الصفحة ، يكون لديك مشغل موسيقى مشترك عبر كل حالة الصفحة.

الآن دعنا نقول أنك فقط اضغط على بعض الأغاني للعب. في هذه الحالة ، يجب تغيير حالة مشغل الموسيقى فقط بدلاً من إعادة تحميل الصفحة بالكامل. يمكن التعامل معها بسهولة عن طريق واجهة المستخدم.

بينما نحن في ngRoute نعلق فقط وجهة نظر وحدة التحكم.


ng-View (تم تطويره بواسطة فريق AngularJS) مرة واحدة فقط لكل صفحة ، بينما يمكن استخدام ui-View (وحدة طرف ثالث) عدة مرات في كل صفحة.

لذلك فإن ui-View هو الخيار الأفضل.


Angular 1.x

https://docs.angularjs.org/api/ngRoute :

تم تطوير ng-route بواسطة فريق angularJS للتوجيه.

ng-route: url (Location) based routing.

مثلا:

$routeProvider
    .when("/home", {
        templateUrl : "home.html"
    })

ui-router :

ui-router هو develoepd بواسطة وحدة طرف ثالث.

واجهة المستخدم: التوجيه القائم على الدولة

مثلا:

 $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'home.html'
        })

-> واجهة المستخدم-جهاز التوجيه يسمح للآراء المتداخلة

-> جهاز التوجيه واجهة المستخدم أكثر قوة من نانوغرام الطريق

https://docs.angularjs.org/api/ngRoute ، ui-router





angularjs-module