कोणीय निर्देश

Question

में विशेषता का अस्तित्व जांचें यह जांचना संभव है कि किसी दिए गए विशेषता निर्देश में मौजूद है या नहीं, आदर्श रूप से अलग-अलग दायरे का उपयोग करना या सबसे खराब स्थिति परिदृश्य में वस्तु वस्तु।

इस निर्देश के साथ जो इस <project status></project> जैसा कुछ दिखता है, मैं सशर्त रूप से स्थिति आइकन प्रस्तुत करना चाहता हूं, लेकिन केवल स्थिति विशेषता मौजूद है।

return { 
    restrict: 'AE', 
    scope: { 
    status: '@' 
    }, 
    link: function(scope, element, attrs) { 
    scope.status === 'undefined' 
    } 
} 

आदर्श रूप से, यह सीधे दायरे में बाध्य होगा, ताकि इसे टेम्पलेट में उपयोग किया जा सके। हालांकि, बाध्य चर का मान अपरिभाषित है। &केवल पढ़ने के लिए और =दो-तरफा बाइंडिंग के लिए जाता है।

मुझे पता है कि यह <project status='true'></project> जोड़कर इसे हल किया गया है, लेकिन निर्देशों के लिए जो मैं अक्सर उपयोग करूंगा, मुझे इसके बजाय नहीं करना होगा। (एक्सएचटीएमएल वैधता, कोई मुद्दा नहीं है)।

Answer 1

यह करने के लिए जिस तरह से लिंक समारोह के attrs पैरामीटर के अंतर्गत विशेषताएं के होने की जाँच करने के लिए है , और इसे अपने निर्देश के अलग-अलग दायरे में चर के लिए असाइन करें।

scope:{}, 
link: function(scope, element, attrs){ 
    scope.status = 'status' in attrs; 
}, 

यह आपके लिंक फ़ंक्शन के भीतर एक कथन का उपयोग किए बिना काम करना चाहिए।

Answer 2

जिस तरह से आप क्या चाहते हो के लिए लिंक समारोह में विशेषता वस्तु को देखकर है:

link: 
    function(scope, element, attrs) { 
    if("status" in attrs) 
     //do something 
    } 

Answer 3

चूंकि attrs मान जावास्क्रिप्ट object का प्रकार है। विशेषता अस्तित्व की जांच करने के लिए हम hasOwnProperty() विधि का उपयोग in कीवर्ड के बजाय भी कर सकते हैं।

इसलिए, यह हो सकता है:

link: function(scope, element, attrs) { 
    var is_key_exist = attrs.hasOwnProperty('status');//Will return true if exist 
} 

आप इस link

Answer 4

जब कोणीय 1.5+ घटकों का उपयोग विशेषताओं के लिए जाँच करने के लिए आप उपयोग कर सकते हैं पर in कीवर्ड और hasOwnProperty() विधि के बीच आगे अंतर पढ़ सकते हैं $ postLink लाइफसाइक्ल हुक और $ तत्व सेवा इस तरह:

constructor(private $element) {} 

$postLink() { 
    if(!this.$element.attr('attr-name')){ 
    // do something 
    } 
}