2013-11-22 14 views
6

के साथ हेडर और पाद लेख को कैसे संभालें I'm बहुत खेद है अगर मैं खुद को बहुत अच्छी तरह से समझा नहीं जाता, तो यहां जाता है। असल में मुझे इस मुद्दे को हल करने की कोशिश करने में परेशानी हो रही है। मैं अपनी कोणीय परियोजना उत्पन्न करने के लिए यमन का उपयोग कर रहा हूं। मेरे पास एक हेडर और पाद लेख है, पाद लेख स्थिर होगा और हेडर को अपने नियंत्रक की आवश्यकता होगी। मेरी समस्या यह है कि, मैं विशेष रूप से हेडर को अन्य नियंत्रकों के बाहर नहीं होना चाहता हूं। हो सकता है कि मैं गलत हूं और यह वास्तव में एक समस्या नहीं है और सबसे अच्छा अभ्यास स्पष्ट रूप से ng-view के बाहर हेडर रखना होगा?AngularJs

<head> 
    <!-- head stuff here --> 
    </head> 
    <body ng-app="dscover.me"> 

     <div ng-include src="'partials/header.html'"></div> 

     <div ng-view=""> 
     </div> 

     <div ng-include src="'partials/footer.html'"></div> 
    </body> 

इस MainCtrl बाहर एक शीर्ष लेख और पाद सहित एक सही तरीका है: यह क्या मैं अब तक किया है? यह केवल मुझे समझ में आता है क्योंकि, अगर मैं एक नया नियंत्रक/पृष्ठ बनाना चाहता था, तो मुझे अभी भी इसके बाहर नियंत्रकों तक पहुंच होगी? समस्या फिर से है कि मैं खुद को rootScope का उपयोग करने से बचना चाहता हूं और दुर्भाग्यवश यह एकमात्र तरीका प्रतीत होता है जब MainCtrl के बाहर हेडर होने की बात आती है?

मुझे भयानक स्पष्टीकरण के लिए खेद है, लेकिन मुझे उम्मीद है कि आप लोग समझेंगे। यदि ऐसा करने का एक बेहतर तरीका है, तो कृपया मुझे बताएं। किसी भी तरह की सहायता को आभार समझेंगे!

+0

आपको यह संरचना रखना चाहिए। यदि आप नियंत्रकों को डेटा का आदान-प्रदान करना चाहते हैं, तो आपको वैसे भी सेवाओं की आवश्यकता होगी। और आप नहीं चाहते हैं कि जब भी दृश्य बदलता है तो शीर्षलेख को फिर से प्रस्तुत किया जाए। – maxdec

+0

रूटस्कोप एक घटना मॉडल का उपयोग कर नियंत्रकों के बीच संचार के लिए एक पूरी तरह से स्वीकार्य तंत्र है जहां नियंत्रक अन्य नियंत्रकों द्वारा सब्सक्राइब किए गए ईवेंट उठाते हैं। – Chandermani

+0

एक और विकल्प हैडर को संदेश भेजने के लिए $ प्रसारण का उपयोग करना होगा, लेकिन मैं इस बात से सहमत हूं कि रूटस्कोप का उपयोग करने में कुछ भी गलत नहीं है। –

उत्तर

3

सबसे पहले, मैं जितना संभव हो AngularJS की दी गई कार्यक्षमता पर भरोसा करने की कोशिश करता हूं। एप्लिकेशन में शीर्ष लेख और पाद को लागू करने के तीन तरीके हैं:

  1. ng-include

कारण आप इसे सादगी और कोड करने के लिए कम है उपयोग करने के लिए क्यों चाहते हैं। डॉक्स से:

को हासिल करेगा, संकलित और एक बाहरी HTML टुकड़ा

तो, यह बस html के एक बाहरी हिस्सा भी शामिल है भी शामिल है।

  1. ng-view

यह कोणीय में एक डिफ़ॉल्ट रूटर है (2.0 से पहले) और वहाँ एक बेहतर विकल्प ui-router कहा जाता है।

यूआई-राउटर AngularUI team द्वारा निर्मित एंगुलरजेएस के लिए रूटिंग फ्रेमवर्क है। यह ngRoute से भिन्न दृष्टिकोण प्रदान करता है जिसमें यह एप्लिकेशन की स्थिति के आधार पर आपके एप्लिकेशन दृश्यों को बदलता है न कि केवल रूट यूआरएल।

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

  1. custom directive

यह विकल्प मामले में इस्तेमाल किया जाना चाहिए अगर आप मुख्य सामग्री गुंजाइश और शीर्ष लेख/पाद लेख में एक तर्क अतिव्यापी है। इसके अलावा आपको इसके साथ अतिरिक्त सुविधाएं मिलती हैं जैसे पुन: प्रयोज्यता इत्यादि।

तो, अपनी पसंद चुनने के लिए है, लेकिन खोज और पढ़ें (here, here, here या here) इससे पहले कि आप लिखने के लिए आलसी मत बनो।