🛀🏻 🍵 🧡 AngularJS के साथ हल्के नियंत्रक 🥇 👩‍🏭 🏂

इस पोस्ट के अलावा।

कौन नहीं जानता, ऐसी चीज है ui- राउटर । मानक कोणीय राउटर की जगह। यह देखते हुए कि वे एंगुलर 2.0 में कुछ इसी तरह की कटौती करने की योजना बना रहे हैं, यह राउटर जल्द ही मानक बन जाएगा।

इसका उपयोग करते हुए, आप एक एप्लिकेशन बना सकते हैं, उदाहरण के लिए, इस तरह:

मुख्य मॉड्यूल

$stateProvider.state('main', { abstract: true views: { 'body': { templateUrl: '/main/views/body/template.html' }, 'header@main': { controller: 'mainBodyHeader' templateUrl: '/main/views/body/header/template.html' }, 'footer@main': { controller: 'mainBodyFooter' templateUrl: '/main/views/body/footer/template.html' } } });

/main/views/body/template.html

 <body> <ui-view name="header"></ui-view> <ui-view name="content"></ui-view> <ui-view name="footer"></ui-view> </body>

लेख मॉड्यूल

 $stateProvider.state('article', { parent: 'main', abstract: true, views: { 'content@main': { templateUrl: '/article/views/content/template.html' }, 'navigation@article': { controller: 'articleContentNavigation' templateUrl: '/article/views/content/navigation/template.html' }, 'sidebar@article': { controller: 'articleContentSidebar' templateUrl: '/article/views/content/sidebar/template.html' } } }); $stateProvider.state('article.popular', { url: '/article/popular', views: { 'list': { controller: 'articleContentListPopular', templateUrl: '/article/views/content/list/popular/template.html' } }, });

/article/views/content/template.html

 <content> <ui-view name="navigation"></ui-view> <ui-view name="sidebar"></ui-view> <ui-view name="list"></ui-view> </content>

इस प्रकार, आप एप्लिकेशन को जितने चाहें उतने भागों में विभाजित कर सकते हैं।

आप अपने खुद के निर्देश भी लिख सकते हैं। यदि नियंत्रक, अद्वितीय चीज़ों के लिए उपयोग किया जाता है, तो बड़े, और फिर निर्देश को किसी भी घटक को लपेटना चाहिए जो कई बार अनुप्रयोग में दिखाई देता है। वैसे, निर्देश, अपने स्वयं के नियंत्रक हो सकते हैं।

 app.directive('demo', function () { return { templateUrl: '/directives/demo/template.html', controller: 'demo' }; });

ng-include

और ng-controller

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

ऐसी सेवाएं हैं जिनमें यह एक सामान्य कोड बनाने के लायक है।

एक रेज़ोल्यूशन राउटर है जहाँ आप सामान्य एसिंक्रोनस ऑपरेशन्स कर सकते हैं ताकि उन्हें प्रत्येक कंट्रोलर में न खींचें।

मैं यह सब क्यों लिख रहा हूँ? इस तथ्य के लिए कि मोटी नियंत्रकों की समस्या उंगली से बाहर निकाली गई है। मानक टूल का उपयोग करके, आप एक मनमाने ढंग से बड़े एप्लिकेशन को लिख सकते हैं जहां औसत नियंत्रक कोड की 200 लाइनों पर कब्जा कर लेगा।

AngularJS के साथ हल्के नियंत्रक

More articles: