कोणीय-मार्ग और कोणीय-यूआई-रूटर के बीच अंतर क्या है?

Question

मैं अपने बड़े अनुप्रयोगों में AngularJS का उपयोग करने की योजना बना रहा हूं । इसलिए मैं इस प्रक्रिया का उपयोग करने के लिए सही मॉड्यूल का पता लगाने की प्रक्रिया में हूं।

एनकाउंटर (कोणीय-मार्ग.जेएस) और यूआई-राउटर (कोणीय-यूआई-राउटर.जेएस) मॉड्यूल के बीच अंतर क्या है ?

कई लेखों में जब ngRoute का उपयोग किया जाता है, तो मार्ग $ मार्गप्रोविडर से कॉन्फ़िगर किया जाता है । हालाँकि, जब यूआई-राउटर के साथ उपयोग किया जाता है, तो मार्ग को $ StateProvider और $ urlRouterProvider से कॉन्फ़िगर किया जाता है ।

बेहतर प्रबंधन और व्यापकता के लिए मुझे किस मॉड्यूल का उपयोग करना चाहिए?

Comments

— 1.4+

Answer 1

यूआई-राउटर एक 3-पार्टी मॉड्यूल है और बहुत शक्तिशाली है। यह सब कुछ सामान्य ngRoute के साथ ही कई अतिरिक्त कार्यों का समर्थन करता है।

यहाँ कुछ सामान्य कारण यू-राउटर को चुना गया है:

• यूआई-राउटर नेस्टेड विचारों और कई नामित विचारों के लिए अनुमति देता है । यह बड़े ऐप के साथ बहुत उपयोगी है जहां आपके पास ऐसे पृष्ठ हो सकते हैं जो अन्य अनुभागों से प्राप्त होते हैं।

• यूआई-राउटर आपको राज्य के नामों के आधार पर राज्यों के बीच मजबूत-प्रकार की लिंकिंग की अनुमति देता है। जब आप अपने लिंक का निर्माण करते हैं, तो url को एक स्थान पर बदलने से उस राज्य की प्रत्येक लिंक अपडेट हो जाएगी ui-sref। बड़ी परियोजनाओं के लिए बहुत उपयोगी है जहाँ URL बदल सकते हैं।

• डेकोरेटर की अवधारणा भी है जिसका उपयोग आपके मार्गों को गतिशील रूप से URL के आधार पर बनाने के लिए किया जा सकता है जो एक्सेस करने की कोशिश कर रहा है। इसका मतलब यह हो सकता है कि आपको हाथ से पहले अपने सभी मार्गों को निर्दिष्ट करने की आवश्यकता नहीं होगी।

• राज्य आपको विभिन्न राज्यों के बारे में विभिन्न सूचनाओं को मैप और एक्सेस करने की अनुमति देते हैं और आप आसानी से राज्यों के बीच जानकारी पास कर सकते हैं $stateParams।

• आप आसानी से तय कर सकते हैं अगर आप एक राज्य या एक राज्य अपने टेम्पलेट के भीतर यूआई तत्व (वर्तमान स्थिति के नेविगेशन पर प्रकाश डाला) को समायोजित करने के की मूल में हैं के माध्यम से $stateui रूटर आप में यह स्थापित करने के माध्यम से दिखा सकता है जो द्वारा प्रदान की $rootScopeपर run।

संक्षेप में, यूआई-राउटर अधिक विशेषताओं के साथ एन-राउटर है, चादरों के नीचे यह काफी अलग है। ये अतिरिक्त सुविधाएँ बड़े अनुप्रयोगों के लिए बहुत उपयोगी हैं।

अधिक जानकारी:

• गीथूब: https://github.com/angular-ui/ui-router
• प्रलेखन:
  • एपीआई संदर्भ: http://angular-ui.github.io/ui-router/site/#/api
  • गाइड: https://github.com/angular-ui/ui-router/wiki
• अक्सर पूछे जाने वाले प्रश्न: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions
• नमूना आवेदन: http://angular-ui.github.io/ui-router/sample/#/

Comments

कुल मिलाकर यह सबसे अच्छा स्पष्टीकरण है, लेकिन एक प्रमुख बिंदु के लिए: "कुल मिलाकर, ui- राउटर अधिक सुविधाओं के साथ ngRouter है"। यह उससे कहीं अधिक मौलिक है: ngRouteकेवल आपको यूआरएल मार्गों के लिए नियंत्रक और टेम्पलेट्स को असाइन करने की अनुमति देता है, जबकि मूल मतिहीनता ui.routerराज्यों में है, जो एक अधिक शक्तिशाली अवधारणा है।

— नैट एबेल

इस उत्तर में फ़ाइलों में अंतर को इंगित करना कुछ के लिए प्रासंगिक हो सकता है। अभी के अनुसार ngRoute: 35.9kB / 4.4kB / 2.5kB और ui-router: 162.9kB / 30.4kB / 11.6kB (अमान्‍य / छोटा / gzipped)।

— एलेक्स रॉस

क्या हम 2015 में 162kb के बारे में गंभीर रूप से चिंतित हैं?

— कैटफ़िश

क्यों नहीं @ कैटफ़िश? खराब इंटरनेट कनेक्शन के साथ दुनिया में कई जगह हैं, इसके बारे में चिंता करना बहुत महत्वपूर्ण है!

— ब्रूनो कैसली

@tfrascaroli मैं असहमत हूं - अगर कोई उपयोगकर्ता पहली बार आपके ऐप को लोड कर रहा है, तो पृष्ठ लोड बार दरों में उछाल के लिए दृढ़ता से सहसंबंधित है । मैं पेज पर एक और 130kB जोड़ने से पहले निश्चित रूप से लागत / लाभ पर विचार करूंगा।

— एंथनी मैनिंग-फ्रैंकलिन

Answer 2

ngRoute AngularJS टीम द्वारा विकसित एक मॉड्यूल है जो पहले AngularJS कोर का हिस्सा था।

ui- राउटर एक फ्रेमवर्क है जो राउटिंग क्षमताओं को बेहतर बनाने और बढ़ाने के लिए AngularJS प्रोजेक्ट के बाहर बनाया गया था।

यूआई-राउटर प्रलेखन से :

AngularUI Router, AngularJS के लिए एक रूटिंग फ्रेमवर्क है, जो आपको अपने इंटरफ़ेस के हिस्सों को एक स्टेट मशीन में व्यवस्थित करने की अनुमति देता है। कोणीय कोर में $ मार्ग सेवा के विपरीत, जो URL मार्गों के आसपास आयोजित की जाती है, UI- राउटर राज्यों के आसपास आयोजित किया जाता है, जिसमें वैकल्पिक रूप से मार्ग, साथ ही साथ अन्य व्यवहार भी हो सकते हैं।

राज्य नामित, नेस्टेड और समानांतर विचारों के लिए बाध्य हैं, जिससे आप अपने एप्लिकेशन के इंटरफ़ेस को शक्तिशाली रूप से प्रबंधित कर सकते हैं।

उनमें से कोई भी बेहतर नहीं है, आपको अपनी परियोजना के लिए सबसे उपयुक्त चुनना होगा।

हालाँकि, यदि आप अपने आवेदन में जटिल विचार रखते हैं और आप "$ राज्य" धारणा से निपटना चाहते हैं। मैं आपको यूआई-राउटर चुनने की सलाह देता हूं।

Comments

एफडब्ल्यूआईडब्लू मैंने अभी काफी समय बिताया है, जो मेरे सिर को एंजुलरज के लिए यूआई-राउटर के खिलाफ पीट रहा है। दस्तावेज़ीकरण मामलों की एक बहुत ही खेद स्थिति में है, यह स्पष्ट रूप से अब वर्षों के लिए अपमानजनक छोड़ दिया गया है। महत्वपूर्ण गाइड के टूटे हुए लिंक, ट्यूटोरियल में नुगेट पैकेजों का गलत नाम, आप इसे नाम दें। आखिरकार मैंने इस मुद्दे को हल करने के बाद मुझे छोड़ दिया, इस मुद्दे stackoverflow.com/questions/23585065/… (साथ ही कई अन्य लोगों के साथ)। अब एनकाउंटर की कोशिश कर रहा है ...

— UnionP

Answer 3

ngRoute एक कोणीय कोर मॉड्यूल है जो बुनियादी परिदृश्यों के लिए अच्छा है। मुझे विश्वास है कि वे आगामी रिलीज में और अधिक शक्तिशाली विशेषताएं जोड़ेंगे।

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

यूआई-राउटर एक योगदान किया गया मॉड्यूल है जो कि एनकाउंटर की समस्याओं को दूर करता है। मुख्य रूप से नेस्टेड / जटिल विचार।

URL: https://github.com/angular-ui/ui-router

Ui- राउटर और ngRoute के बीच कुछ अंतर

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

Answer 4

ngRoute कोर AngularJS ढांचे का हिस्सा है।

यूआई-राउटर एक सामुदायिक पुस्तकालय है जिसे डिफ़ॉल्ट रूटिंग क्षमताओं पर बेहतर बनाने के प्रयास के लिए बनाया गया है।

यहाँ ui- राउटर को कॉन्फ़िगर / सेट करने के बारे में एक अच्छा लेख है:

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

Answer 5

यदि आप नेकाउट प्रतिमान के भीतर कार्यान्वित नेस्टेड विचार कार्यक्षमता का उपयोग करना चाहते हैं, तो कोणीय-मार्ग-खंड की कोशिश करें - इसका उद्देश्य इसे बदलने के बजाय एनकाउंटर का विस्तार करना है।

Comments

मुझे आपके उत्तर की प्रासंगिकता नहीं दिख रही है। लेखक ने विशेष रूप से कोणीय-मार्ग और कोणीय-यूआई-राउटर के बीच अंतर के बारे में पूछा। इसके अलावा, एक अस्वीकरण कि आप निर्माता हैं अपने स्वयं के पुस्तकालयों को बढ़ावा देने के लिए उपयोगी होगा।

— शीशी

प्रासंगिकता सरल है: कोणीय-मार्ग + कोणीय-मार्ग-खंड = कोणीय-यूआई-राउटर। तो, अंतर यह है: कोणीय-यूआई-राउटर - कोणीय-मार्ग = कोणीय-मार्ग-खंड :)

— आर्ट

मुझे लगता है कि इसका एक वैध जवाब है। angular-route-segment.com निश्चित रूप से उन लोगों के लिए एक अच्छा विकल्प है जो ui- राउटर का उपयोग करने के ओवरहेड नहीं चाहते हैं। इसके अलावा @ बहुत अच्छी तरह से, लोग इन पुस्तकालयों को बनाने के लिए कड़ी मेहनत करते हैं, इसका प्रचार करने के लिए यह एक बुरी बात नहीं है

— फिल

Answer 6

आम तौर पर ui- राउटर एक राज्य तंत्र पर काम करता है ... इसे एक आसान उदाहरण से समझा जा सकता है:

मान लीजिए कि हमारे पास एक संगीत पुस्तकालय (जैसे ..आगाना या सावन या कोई अन्य) का एक बड़ा अनुप्रयोग है। और पृष्ठ के निचले भाग में, आपके पास एक म्यूजिक प्लेयर है, जो पेज के सभी राज्य में साझा किया जाता है।

चलिए अब आपको बताते हैं कि कुछ गाने पर क्लिक करें। इस मामले में, केवल उस संगीत खिलाड़ी की स्थिति को पूर्ण पृष्ठ को फिर से लोड करने के बजाय बदलना चाहिए। इसे आसानी से यूआई-राउटर द्वारा नियंत्रित किया जा सकता है।

जबकि ngRoute में हम सिर्फ व्यू और कंट्रोलर को जोड़ते हैं।

Comments

यह किया जा सकता है और सेवाओं और कारखानों का उपयोग करके किया जाना चाहिए। इस पैकेज के उपयोग में कोणीय मार्गों, राज्यों और पैटर्न को समझने की कमी है। यूआरएल द्वारा राज्यों को संभाला जाता है, जो सही है यदि आप ऐप को एक स्पाइसएक्सिक राज्य में साझा करना चाहते हैं, तो इसके अलावा आप एक ही दृश्य में कई नियंत्रक हो सकते हैं जो सेवा डेटा अपडेट या यूआरएल परम पर प्रतिक्रिया करते हैं। यूआई राउटर चीजों को गड़बड़ करते हैं और कोणीय पैटर्न को पूरी तरह से नष्ट कर देते हैं।

— पाब्लो एज़ेकिएल लियोन

मैं पूरी तरह से सहमत। अभी भी एक स्पष्टीकरण नहीं मिल सकता है जहां इस राज्य मशीन का उपयोग करना आवश्यक है

— कुशाल्वम

Answer 7

कोणीय 1.x

एनजी मार्ग :

एनजी मार्ग को कोणीयजेएस टीम द्वारा रूटिंग के लिए विकसित किया गया है।

एनजी-मार्ग: url (स्थान) आधारित रूटिंग।

उदाहरण के लिए:

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

उई-मार्ग :

ui- राउटर 3 पार्टी मॉड्यूल द्वारा develoepd है।

यूआई-राउटर: राज्य आधारित रूटिंग

उदाहरण के लिए:

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

-> यूआई-राउटर नेस्टेड विचारों के लिए अनुमति देता है

-> ui- राउटर एनजी-मार्ग की तुलना में अधिक शक्तिशाली है

एनजी-राउटर , यूआई-राउटर

Answer 8

ngRoute कोणीय टीम द्वारा निर्मित एक मॉड्यूल है जो बुनियादी क्लाइंट-साइड रूटिंग कार्यक्षमता प्रदान करता है। यह मॉड्यूल रूटिंग के लिए एक काफी शक्तिशाली आधार प्रदान करता है, और इस रूटिंग पोस्ट में उदाहरण के रूप में ठोस रूटिंग कार्यक्षमता देने के लिए बहुत आसानी से बनाया जा सकता है, (वार्ड बेल और बेन नडेल, लेखक के बीच टिप्पणी के निशान को पढ़ना सुनिश्चित करें) - वे एक लेख हैं कोणीय पेशेवरों की जोड़ी)

यूआई-राउटर फोकस को url- केंद्रित मार्गों से अनुप्रयोग "राज्यों" में स्थानांतरित करता है, जो कि url में परिलक्षित हो सकता है या नहीं।

यूआई-राउटर द्वारा जोड़े गए प्राथमिक फीचर्स नेस्टेड स्टेट्स और नामित नाम हैं।

नेस्टेड राज्य आपको आवेदन के विभिन्न टुकड़ों के लिए नियंत्रक तर्क को अलग करने की अनुमति देते हैं। इसका एक बहुत ही सरल उदाहरण शीर्ष पर प्राथमिक नेविगेशन के साथ एक ऐप होगा, बाईं ओर एक द्वितीयक नेविगेशन सूची और दाईं ओर सामग्री। नेस्टेड राज्यों के बिना, एक एकल नियंत्रक को आमतौर पर द्वितीयक नेविगेशन के साथ ही सामग्री के लिए प्रदर्शन तर्क को संभालना होगा। नेस्टेड रूटिंग आपको इन चिंताओं को अलग करने की अनुमति देता है।

नामित दृश्य यूआई-राउटर की एक और अतिरिक्त विशेषता है। NgRoute के साथ, आप एक पृष्ठ पर केवल एक ही ngView निर्देश कर सकते हैं, जबकि ui-रूटर में नामित विचारों के साथ आप कई ui-view निर्देश निर्दिष्ट कर सकते हैं, और फिर प्रत्येक राज्य नामों के टेम्पलेट और नियंत्रक को प्रभावित करने में सक्षम है। इसका एक सुपर सरल उदाहरण यह होगा कि आपके ऐप की मुख्य सामग्री प्राथमिक दृश्य होगी, और उसके बाद एक फुटर बार भी होगा जो एक अलग यू-व्यू होगा। इस परिदृश्य में, पाद के नियंत्रक को अब राज्य / मार्ग परिवर्तनों के लिए सुनना नहीं पड़ता है।

इस पॉडकास्ट एपिसोड पर ngRoute और ui- राउटर की एक अच्छी तुलना पाई जा सकती है ।

बस चीजों को और अधिक भ्रमित करने के लिए, नए "आधिकारिक" रूटिंग मॉड्यूल पर नज़र रखें कि कोणीय टीम को 1.5 और 2.0 के कोणीय के संस्करणों के लिए रिलीज़ करने की उम्मीद है। यह ngRoute मॉड्यूल की जगह लेगा। यहां नए राउटर मॉड्यूल के लिए वर्तमान प्रलेखन है - यह इस पोस्टिंग के रूप में काफी हद तक विरल है क्योंकि कार्यान्वयन अभी तक अंतिम रूप नहीं दिया गया है। जब यह मॉड्यूल वास्तव में जारी किया जाएगा, तो अधिक समाचार के लिए यहां देखें ।

Answer 9

ngRoute एक बुनियादी मार्ग पुस्तकालय है, जहाँ आप किसी भी मार्ग के लिए केवल एक दृश्य और नियंत्रक निर्दिष्ट कर सकते हैं।

यूआई-राउटर के साथ, आप समानांतर और नेस्टेड, दोनों को कई दृश्य निर्दिष्ट कर सकते हैं। इसलिए यदि आपके आवेदन में किसी भी प्रकार के जटिल मार्ग / दृश्य की आवश्यकता है (या भविष्य में आवश्यकता हो सकती है), तो ui- राउटर के साथ आगे बढ़ें।

यह एंगुलरयूआई राउटर के लिए सबसे अच्छी शुरुआत है।

Answer 10

मूल बात जो आपको जानना है: एनजी-राउटर का उपयोग करता है $location.path()और यूआई-राउटर का उपयोग करता है$state.go

हमें सभी सुविधाओं को आराम दें।

Answer 11

यूआई राउटर आपके जीवन को आसान बनाते हैं! आप इसे अपने अनुप्रयोगों में इंजेक्ट करके AngularJS एप्लिकेशन में जोड़ सकते हैं ...

ng-route कोर AngularJS के हिस्से के रूप में आता है, इसलिए यह सरल है और आपको कम विकल्प देता है ...

एनजी-मार्ग को बेहतर समझने के लिए यहां देखें : https://docs.angularjs.org/api/ngRoute

इसका उपयोग करते समय भी, उपयोग करने के लिए मत भूलना: ngView ..

एनजी-यूआई-राउटर अलग है लेकिन:

https://github.com/angular-ui/ui-router लेकिन आपको और विकल्प देता है ...।

Answer 12

AngularUI Router, AngularJS के लिए एक रूटिंग फ्रेमवर्क है, जो आपको अपने इंटरफ़ेस के हिस्सों को एक स्टेट मशीन में व्यवस्थित करने की अनुमति देता है। Angular ngRoute मॉड्यूल में $ मार्ग सेवा के विपरीत, जो URL मार्गों के आसपास आयोजित किया जाता है, UI-Router राज्यों के आसपास आयोजित किया जाता है, जिसमें वैकल्पिक रूप से मार्ग, साथ ही साथ अन्य व्यवहार भी संलग्न हो सकते हैं।

https://github.com/angular-ui/ui-router

Answer 13

ngRoute Angular.js टीम द्वारा विकसित एक मॉड्यूल है जो पहले कोणीय कोर का हिस्सा था।

यूआई-राउटर एक ढांचा है जो राउटिंग कैपैबलिटीज को सुधारने और बढ़ाने के लिए Angular.js प्रोजेक्ट के बाहर बनाया गया था।

Answer 14

1- ngRoute कोणीय टीम द्वारा विकसित किया गया है जबकि ui- राउटर एक 3 पार्टी मॉड्यूल है। 2- एनराउट रूट रूट के आधार पर राउलिंग लागू करता है जबकि यूआई-राउटर आवेदन की स्थिति के आधार पर रुटिंग को लागू करता है। 3- औई-राउटर वह सब कुछ प्रदान करता है जो एनजी-रूट कुछ अतिरिक्त सुविधाएं प्रदान करता है जैसे नेस्टेड स्टेट्स और कई नामित नाम।

Answer 15

ng-View(AngularJS टीम द्वारा विकसित) का उपयोग प्रति पृष्ठ केवल एक बार किया जा सकता है, जबकि ui-View(3rd पार्टी मॉड्यूल) प्रति पृष्ठ कई बार उपयोग किया जा सकता है।

ui-View इसलिए सबसे अच्छा विकल्प है।