कोणीय प्रकाश निर्देशकीय विरासत और अन्य उपहार

हाल ही में, Armin Ronacher के एक लेख को पढ़ने के बाद, मैंने सोचा कि निर्देशन और विरासत में सक्षम होना अच्छा होगा
जल्द ही यह अपने कोणीय प्रकाश पुस्तकालय ( लाइट ) में महसूस किया।

सामान्य तौर पर, सभी उत्तराधिकार निर्देश को उन विधियों में विभाजित करने के लिए आते हैं जिन्हें भविष्य में पुनर्परिभाषित किया जा सकता है।
यहाँ अल-शो के आधार पर एक अल-शो-धीमा उदाहरण है, जहां एक तत्व धीरे-धीरे प्रकट होता है और छिपता है, इस तरह दिखता है:

alight.directives.al.showSlow = function(element, name, scope, env) { var dir = alight.directives.al.show(element, name, scope, env); //    dir.showDom = function() { //  "show" $(element).fadeIn(1000); } dir.hideDom = function() { //  "hide" $(element).fadeOut(1000); } return dir; } 

अल-शो विरासत उदाहरण
एक अन्य उदाहरण है, अल-वैल्यू के आधार पर अल-वैल्यू-डिले , जहां डेटा मॉडल में देरी (बिना दोहराए) के साथ आता है।

एकाधिक वंशानुक्रम भी यहां संभव है, लेकिन अभी तक यह आवश्यक नहीं है।


यहां कुछ और उपयोगी तरीके दिए गए हैं:

1) "फटे हुए" डोम से बांधना, अर्थात। एक जो दस्तावेज़ में नहीं है:

 tpl = $('<div al-init="i=0" al-click="i+=1">{{i}}</div>') //   DOM alight.applyBindings(null, tpl[0]) //   $('body').append(tpl) //     body 

2) निर्देश का नाम बदलने की क्षमता, मुझे नहीं पता कि कैसे Angular.js में, लेकिन सही मायने में यह सरल है:

 alight.directives.al.myKeypress = alight.directives.al.keypress 

3) Angular.js में, मुझे कभी-कभी एक सवाल था कि $ डाइजेस्ट / $ लागू होने के तुरंत बाद अपने कोड को कैसे कॉल किया जाए, भले ही $ डाइजेस्ट प्रक्रिया में हो। $ पचा के बजाय, एक $ स्कैन समारोह है, और आप इसे इस तरह से संसाधित करने के बाद अपने कोड को कॉल कर सकते हैं:

 scope.$scan(function(){ // do something }) 

4) DOM में स्टेटिक बाइंडिंग, aLight में DOM में मानों को बाँधने के 2 तरीके हैं:

  <a href="{{first}}">{{first}}</a> <a href="{{=second}}">{{=second}}</a> 

अंतर यह है कि 2 के मामले में चर में परिवर्तन की कोई ट्रैकिंग नहीं है, यह एक नियमित, एक समय प्रतिपादन के रूप में सुविधाजनक है।

5) निर्देशों के लिए उपसर्ग। प्रत्येक निर्देश अपने स्वयं के "खंड" में है: अल-इफ, बो-इफ, यूआई-इफ, आदि। ये अनुभाग आपको निर्देशों की उपस्थिति की निगरानी करने की अनुमति देते हैं (जैसा कि नॉकआउट। जेएस में), उदाहरण के लिए यदि मैं लिखता हूं:

 <div al-ifn="visible"></div> 

तब लाइक एक त्रुटि देगा कि ऐसा कोई निर्देश नहीं है।

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

आज के निर्देशों से कुछ और बातें:

अल-कीडाउन, अल-मूसमोव आदि के लिए, $ घटना सीधे अभिव्यक्ति में उपलब्ध है, मैंने सोचा कि यह सुविधाजनक हो सकता है:

 <input type="text" al-keydown="key = $event.keyCode" /> 

अल-केंद्रित निर्देश दो तरह से बाध्यकारी बनाता है - जब चर को केंद्रित = सत्य पर सेट किया जाता है, तो फोकस तत्व पर सेट होता है, और जब तत्व पर ध्यान केंद्रित होता है, तो चर को सही पर सेट किया जाता है, जब फोकस उसी तरह से चला जाता है।

 <input type="text" al-focused="focused" /> 

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

वह मूल रूप से यह है। टिप्पणियों और सुझावों का स्वागत है।