एंगुलरजेएस डायरेक्टिव ए बनाम ई

113

मैं एक छोटी सी टीम में काम कर रहा हूँ, जो कि अंगुलरजेएस में बन रही है और कुछ बुनियादी मानकों और सर्वोत्तम प्रथाओं को बनाए रखने की कोशिश कर रही है; विशेष रूप से दिए गए हम कोणीय के साथ अपेक्षाकृत नए हैं।

मेरा सवाल निर्देश के संबंध में है। अधिक सटीक, restrictविकल्प।

हम में से कुछ restrict: 'E'इस प्रकार <my-directive></my-directive>html में उपयोग कर रहे हैं ।

अन्य HTML में उपयोग कर रहे हैं restrict: 'A'और कर रहे हैं <div my-directive></div>।

फिर, ज़ाहिर है, आप restrict: 'EA'उपरोक्त दोनों में से किसी का भी उपयोग और उपयोग कर सकते हैं ।

फिलहाल यह कोई बड़ी बात नहीं है, हालांकि जब यह प्रोजेक्ट जितना बड़ा होगा, यह उतना ही बड़ा होगा, तो मैं चाहूंगा कि कोई भी इसे आसानी से समझ सके।

क्या काम करने का गुण या तत्व तरीका भी है?

क्या कोई नुकसान हमें पता होना चाहिए, अगर विशेषता पर तत्व कहते हैं?

javascript html angularjs

— डैरेन वेनराइट
स्रोत

100

प्रलेखन के अनुसार :

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

पूर्ण उत्तर के लिए नुकसान के बारे में निम्नलिखित टिप्पणी संपादित करें:

यह मानते हुए कि आप एक ऐसा ऐप बना रहे हैं जो इंटरनेट एक्सप्लोरर <= 8 पर चलना चाहिए, जिसका समर्थन AngularJS 1.3 की AngularJS टीम ने गिरा दिया है, आपको इसे काम करने के लिए निम्नलिखित निर्देशों का पालन करना होगा: https: //docs.angjjjs .org / गाइड / यानी

— ngasull
स्रोत

3

मैंने उन डॉक्स को ऊपर और नीचे पढ़ा है लेकिन यह एक याद किया गया है :) धन्यवाद।

— डेरेन वेनराइट

3

यह स्पष्टीकरण किसी भी नुकसान और पेशेवरों / विपक्षों को कवर नहीं करता है।

— कॉन्स्टेंटिन क्रैस

मेरे जवाब के अनुसार नुकसान के बारे में अद्यतन किया। मैंने पेशेवरों / विपक्षों का उल्लेख नहीं किया क्योंकि मुझे लगता है कि हम यहां सर्वोत्तम प्रथाओं के बारे में बात कर रहे हैं, खासकर जब कोणीय टीम द्वारा अनुशंसित और समझाया जाता है।

— ngasull

1

"मैंने पेशेवरों / विपक्षों का उल्लेख नहीं किया क्योंकि मुझे लगता है कि हम यहां सर्वोत्तम प्रथाओं के बारे में बात कर रहे हैं, खासकर जब कोणीय टीम द्वारा अनुशंसित और समझाया जाता है।" है ना? :)

— अलेक्जेंडर मिल्स

169

प्रतिबंधित निर्देश प्रकार को परिभाषित करने के लिए है, और यह A(गुण), C(वर्ग), E(तत्व) और M(समन्वय) हो सकता है, चलो मान लेते हैं कि निर्देश का नाम है Doc:

प्रकार: उपयोग

ए = <div Doc></div>

सी = <div class="Doc"></div>

ई = <Doc data="book_data"></Doc>

म = 

— सीफ तमल्लाह
स्रोत

2

@ मिनांज द्वारा दिए गए उत्तर से कम स्पष्ट, लेकिन उनके उत्तर को देखने के बाद मैं आपको समझ गया ...

— अलेक्जेंडर मिल्स

47

प्रतिबंधित विकल्प आम तौर पर निम्न पर सेट होता है:

'ए' - केवल विशेषता नाम से मेल खाता है
'ई' - केवल तत्व नाम से मेल खाता है
'सी' - केवल वर्ग के नाम से मेल खाता है
'एम' - केवल टिप्पणी से मेल खाता है

यहाँ प्रलेखन लिंक है ।

— निकुंज गाँधी
स्रोत

सरल और साफ

— गौरव_0093

7

IE8 को कस्टम टैग को स्वीकार करने के लिए कुछ काम करने के लिए आपको IE8 में एलिमेंट का समर्थन नहीं किया गया है।

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

— जैक एलन
स्रोत

5

जैसा कि मुझे पता है कि कस्टम तत्वों के साथ IE समस्या है। डॉक्स से उद्धृत :

3) आप कस्टम तत्व टैग का उपयोग नहीं करते हैं जैसे कि (इसके बजाय विशेषता संस्करण का उपयोग करें)

४) यदि आप कस्टम एलिमेंट टैग का उपयोग करते हैं , तो आपको IE you और नीचे से खुश करने के लिए ये कदम उठाने होंगे

<!doctype html>
  <html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
    <head>
      <!--[if lte IE 8]>
        <script>
          document.createElement('ng-include');
          document.createElement('ng-pluralize');
          document.createElement('ng-view');

          // Optionally these for CSS
          document.createElement('ng:include');
          document.createElement('ng:pluralize');
          document.createElement('ng:view');
        </script>
      <![endif]-->
    </head>
    <body>
      ...
    </body>
  </html>

— खान को
स्रोत

4

ख़तरा:

<my-directive></my-directive>IE8 पर अपने स्वयं के html तत्व का उपयोग न करें बिना वर्कअराउंड ( https://docs.angularjs.org/guide/ie ) के बिना
अपने स्वयं के HTML तत्वों का उपयोग करना html सत्यापन को विफल कर देगा।
समान पैरामीटर के साथ निर्देश इस तरह किया जा सकता है:

<div data-my-directive="ValueOfTheFirstParameter"></div>

इसके अलावा:

<my-directive my-param="ValueOfTheFirstParameter"></my-directive>

हम कस्टम HTML तत्वों का उपयोग नहीं करते हैं, क्योंकि यदि यह 2 तथ्य हैं।

थर्ड पार्टी फ्रेमवर्क द्वारा प्रत्येक निर्देश को दो तरीकों से लिखा जा सकता है:

<my-directive></my-directive>

या

<div data-my-directive></div>

वही करता है।

— कोंस्टेंटिन क्रैस
स्रोत

1

यदि आप समान 1 स्कोप पैरामीटर के साथ एक निर्देश बनाना चाहते हैं, तो ए के साथ करना आसान है क्योंकि आपको अतिरिक्त विशेषता नहीं बनानी है।

— कॉन्सटेंटिन क्रैस

आपको अतिरिक्त से क्या मतलब है? दोनों विकल्पों में एक विशेषता है।

— एक बेहतर ओलिवर

3

तत्वों के साथ 2 समस्याएं:

पुराने ब्राउज़रों के साथ बुरा समर्थन।
एसईओ - Google का इंजन उन्हें पसंद नहीं करता है।

गुण का उपयोग करें।

— अमीर पोपोविच
स्रोत

तत्वों के रूप में निर्देश एसईओ समस्या पैदा कर सकते हैं? मैं आश्चर्यचकित हूँ। और क्या replaceविशेषता के बारे में true?

— chalasr

1

इन दावों को संदर्भों की आवश्यकता है। प्वाइंट 1 काफी अच्छी तरह से स्थापित है, लेकिन मैं प्वाइंट 2 के बारे में सूत्रों को देखना पसंद

— करूंगा