निर्देश के आंतरिक टेम्पलेट में एनजी-क्लिक कार्यक्षमता प्रदान नहीं कर रहा है

Question

ng-click अलर्ट प्रदान नहीं कर रहा है। जब निर्देश का आंतरिक टेम्पलेट क्लिक किया जाता है तो अलर्ट बॉक्स नहीं दिखाया जाता है।

बेला लिंक यहाँ है: http://jsfiddle.net/NNDhX/

Answer 1

आपका निर्देश का अपना अलग गुंजाइश है। तो 'हाय' फ़ंक्शन को निर्देश के दायरे में होना चाहिए। यदि आप अपने कंट्रोलर के फ़ंक्शन को पास करना चाहते हैं तो आपको बाध्यकारी करना चाहिए, जैसे scope: { ..., hi: '&' } और फिर <you-directive hi='hi' ..>। यहां इस बारे में दस्तावेज़ीकरण का एक लिंक दिया गया है: Understanding Transclusion and Scopes।

तो बस समारोह को जोड़ने में इसे जोड़ने के लिए पर्याप्त है:

link: function(scope, element, attrs) { 
    scope.hi = function() { alert("hi"); } 

यहाँ बेला अद्यतन किया जाता है: http://jsfiddle.net/GwBAh/

Answer 2

अलग कार्यक्षेत्रों के पूरे विचार से बचने के लिए माता-पिता के बीच < बातें 'साझा करने' ठीक है -> बच्चे के क्षेत्र, किसी भी तरह से उन्हें प्रकट होने से बचाने और (अनजाने में) अन्य निर्देश/नियंत्रकों द्वारा बदला गया।

transclude: true, 
/*scope: { title:'@zippyTitle' },*/ 

फिर जगह: निर्देश की गुंजाइश परिभाषा (नीचे टिप्पणी की) को हटाने के द्वारा

प्रारंभ:

तुम सच में अलग दायरे से बचने के लिए और माता पिता की गुंजाइश का हिस्सा चाहते हैं, यह कोशिश विशेषताएं (attrs) के निर्देश के तत्व से निर्देशों 'गुंजाइश पर:

scope.attrs = attrs; 

नोट: ऐसा करके attrs संपत्ति माता-पिता (Ctrl3) दायरे पर भी उपलब्ध होगी।

और अंत में scope.attrs

template: '<div>' + 
       '<div class="title">{{attrs.zippyTitle}}</div>' + 
       '<div class="body" ng-transclude></div>' + 
         '<a ng-click="hi();">hi</a>' + 
      '</div>', 

jsFiddle के आधार पर शीर्षक को परिभाषित: http://jsfiddle.net/NNDhX/1/

Answer 3

अगर यह सबसे अच्छा तरीका है मैं नहीं जानता, लेकिन आप का उपयोग करने के निर्देश में $ माता-पिता का उपयोग कर सकते अभिभावक दायरा एक निर्देश के अंदर http://jsfiddle.net/EKDse/

Answer 4

नियंत्रक समारोह transcluded ब्लॉक के भीतर बुलाया जाना चाहिए:

<a ng-click="$parent.hi();">parent</a> 

यहाँ पूर्ण बेला उदाहरण के लिए लिंक है। निर्देश के टेम्पलेट के अंदर नियंत्रक विधि का उपयोग करना आपका निर्देश नियंत्रक पर निर्भर करता है और इसके अवशेषों (निर्देशक-बाहरी नियंत्रक) द्वारा एक अवांछित डिज़ाइन है।

अपने नमूने में <a> स्थानांतरित कोड में कोड का टुकड़ा traslate। इसने आपके निर्देश को और अलग किया और समस्या हल की:

<div class="zippy" zippy-title="Details: {{title}}..."> 
    {{text}} 
    <a ng-click="hi();">hi</a> 
</div>