2013-02-24 34 views
6

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

मैं जिस निर्देश का निर्माण कर रहा हूं वह एक फ़ाइल से टेम्पलेट पढ़ रहा है, इसे $ संकलन के साथ संकलित करता है और फिर आइटम के दायरे में बांधता है (लिंक)। बाध्यकारी का परिणाम एक डोम पेड़ है। संवाद को दृश्यमान बनाने के लिए मुझे मौजूदा पेम में इस तत्व को कुछ तत्वों में जोड़ना होगा। मेरे संवाद की प्रकृति ऐसी है कि इसे सीधे शरीर टैग में जोड़ना समझ में आता है। सूची

पर विभिन्न वस्तुओं के साथ संयोजन में कई बार उपयोग की जाएगी, तो यहां मेरा प्रश्न है: इस प्रक्रिया में से कितना (संकलन, बाध्य, संलग्न) अग्रिम में किया जा सकता है? मैं निश्चित रूप से एक बार संकलन चला सकते हैं। मैं संकलन परिणाम को $ जड़कोप में भी बांध सकता हूं और इसे शरीर टैग में जोड़ सकता हूं (छुपा)। इस तरह मैं बाद में दृश्यता चालू कर सकता हूं और संवाद दिखा सकता हूं।

लेकिन यदि यह पहले से ही बाध्य है और डोम से जुड़ा हुआ है, तो क्या यह किसी अन्य दायरे में फिर से बांधने के लिए कोशेर है, यदि ऐसा है - तो ऐसा करने का सही तरीका क्या है? एक और सवाल यह है कि यह भी लायक है? हर बार इसकी आवश्यकता होने पर इसे फिर से सम्मिलित किया जा सकता है?

उत्तर

2

मुझे लगता है कि बढ़िया सवाल है। आप सोच रहे हैं कि कोई तत्व के दायरे को "हॉट स्वैप" कर सकता है या नहीं। मुझे नहीं पता कि ऐसा करने का कोई तरीका है या यहां तक ​​कि अगर ऐसा है, तो यह कोणीय तरीका है। मैं इसे लेता हूं कि आपने देखा है कि ng-view आपको प्राप्त करने के लिए कैसे काम करता है?

मेरी सलाह है कि एक बार $ संकलन करें, परिणाम रखें, लिंक या ट्रांसक्यूशन फ़ंक्शन या जिसे कहीं भी एंगुलर पार्लान्स में कहा जाता है, कहीं भी। और इसे संवाद के प्रत्येक आवश्यक उदाहरण के लिए बुलाओ।

4

यदि आप कभी भी एक समय में एक संवाद प्रदर्शित करने जा रहे हैं और आप इसे अक्सर इस्तेमाल करेंगे, तो आपको इसे किसी अन्य दायरे में फिर से बांधना नहीं होगा, केवल दायरे पर डेटा बदलें। कुछ इस तरह:

  1. अपने संवाद
  2. बनाएं निर्देश के लिए एक सेवा बनाएँ और इसे में आपकी सेवा इंजेक्षन। जब लिंकिंग फ़ंक्शन निष्पादित होता है, तो सेवा के लिए $ scope.dialogData जैसे कुछ पास करें ताकि सेवा डेटा अपडेट कर सके।
  3. एक नियंत्रक बनाएं जो सेवा इंजेक्शन प्राप्त करता है। संवाद प्रदर्शित करने के लिए सेवा के माध्यम से संवाद डेटा सेट करें। चूंकि आप अपने नियंत्रक में डेटा संशोधित कर रहे हैं जो निर्देशों के दायरे पर है, कोणीय नोटिस करता है और आपके संवाद को अपडेट करता है।
  4. अपनी डायलॉग रैपर पर एनजी-शो जोड़ें ताकि इसे आपकी सेवा पर खुली()/क्लोज़() विधियों को कार्यान्वित करना आसान हो सके।

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

5

यह वास्तव में उत्कृष्ट प्रश्न है और मुझे यह देखकर खुशी हो रही है कि अधिक से अधिक लोग सेवाओं के रूप में संवाद से संपर्क करना शुरू कर रहे हैं।

अपने विशेष सवाल के बारे में

, यहाँ मेरे विचारों में से कुछ हैं:

  • आप कर सकते हैं "कैश" जोड़ने समारोह (जो है - समारोह है कि $compile कॉल से दिया जाता है) के रूप में की जरूरत है और फिर फोन इस समारोह (गुंजाइश चर में गुजर रहा है)।
  • डालने (छुपा) संकलित तत्व डालने के बजाय आप इसे केवल मांग पर संलग्न कर सकते हैं, जब एक संवाद खोला जाता है। इसके शीर्ष पर मैं <body> के बजाय $rootElement पर मॉडल तत्व को संलग्न करता हूं, बस ng-app को ऊपर दिए गए डीओएम तत्वों को स्पर्श न करने के लिए। बस डीओएम के हिस्सों को छूने के लिए नहीं है कि AngularJS नियंत्रण नहीं कर रहा है।
  • आईएमओ संवाद वास्तव में अंगुलरजेएस मार्गों के करीब हैं (क्योंकि वे अलग-अलग "दृश्य" प्रदान करते हैं) और इस तरह मोडल दिखाए जाने से पहले वादे को हल करने की क्षमता बहुत अच्छी होगी (मार्गों के साथ)।

वास्तव में अच्छी, सामान्य संवाद सेवा तैयार करते समय विचार करने के लिए कई चीजें हैं और मुझे आशा है कि उन सलाहओं के साथ-साथ दूसरों द्वारा प्रदान किए गए उत्कृष्ट इनपुट के साथ ही आपको सलाह मिल जाएगी। लेकिन यह सब थोड़ा सैद्धांतिक है, इसलिए यदि आप यहां चर्चा की गई कार्यान्वयन को देख रहे हैं तो आप this implementation पर एक नज़र डाल सकते हैं। (http://angular-ui.github.com/bootstrap/ से $ संवाद सेवा - यह पूरी तरह से अनुकूलन योग्य है इसलिए बूटस्ट्रैप के अलावा अन्य सीएसएस के साथ उपयोग किया जा सकता है। दस्तावेज़ीकरण here)।

यह इस खनखनाहट में कार्रवाई में देखा जा सकता: http://plnkr.co/edit/PG0iHG?p=preview

+0

सुनिश्चित नहीं हैं के बारे में बुलेट बिंदु दो - संवाद आम तौर पर अपनी स्थिति पता लगाने दस्तावेज़ निर्देशांक में, और एक ही तरीका है 'top' का उपयोग कर सही स्थिति सुनिश्चित करने के लिए और' बाएं पीएक्स शरीर पर सही है। मेरा मतलब है, मान लीजिए कि आप ऑफ़सेट माता-पिता की स्थिति को कम नहीं करना चाहते हैं। – jpsimons

+0

@ pkozlowski.opensource मैंने आपके प्लंक और $ संवाद के लिए प्रलेखन की जांच की है (अब $ modal मुझे लगता है)। क्या आप मुझे समझा सकते हैं कि हम संवाद विकल्पों में दोहराने वाले से दायरा क्यों नहीं लगा सकते हैं। यह क्यों काम नहीं करता है? – uriDium

संबंधित मुद्दे