दिलचस्प पोस्ट
जावास्क्रिप्ट में फ़ंक्शन, जिसे केवल एक बार कहा जा सकता है आईफ़ोन अनज़िप कोड क्लाइंट साइड जावास्क्रिप्ट फ़ंक्शन से सर्वर कोड के पीछे कोड कैसे कॉल करें? मैं एसवीएन के साथ एक निर्देशिका को कैसे अनदेखा कर सकता हूं? सेलेनियम – पायथन – ड्रॉप-डाउन मेनू विकल्प मान रोटेशन एंड्रॉइड पर गतिविधि पुनः आरंभ 600851475143 के लिए "पूर्णांक संख्या बहुत बड़ी" त्रुटि संदेश क्या सी ++ 11 सदिश <कॉन्स्ट टी> की अनुमति देता है? __init__.py क्या है? इन दो गुणन कार्यों को अलग-अलग परिणाम क्यों देते हैं? Strings.xml में किसी अन्य स्ट्रिंग से एक स्ट्रिंग को संदर्भित करें? मैं एएसपी.नेट एमवीसी में पेजिंग कैसे करूं? जावास्क्रिप्ट / jQuery का उपयोग कर पृष्ठ के शीर्ष तक स्क्रॉल करें? कोड का उपयोग करते हुए डिवाइस स्क्रीन आकार की श्रेणी (छोटे, सामान्य, बड़े, एक्सलर्ज) निर्धारित करने के लिए कैसे करें? एक स्ट्रिंग में एक वर्ण की घटना की गणना

AngularJS – निर्देश के लिए समारोह पास

मेरे पास एक उदाहरण कोणीय जेएस है

<div ng-controller="testCtrl"> <test color1="color1" updateFn="updateFn()"></test> </div> <script> angular.module('dr', []) .controller("testCtrl", function($scope) { $scope.color1 = "color"; $scope.updateFn = function() { alert('123'); } }) .directive('test', function() { return { restrict: 'E', scope: {color1: '=', updateFn: '&'}, template: "<button ng-click='updateFn()'>Click</button>", replace: true, link: function(scope, elm, attrs) { } } }); </script> </body> </html> 

मैं चाहता हूं कि जब मैं बटन पर क्लिक करे, तो सतर्क बॉक्स दिखाई देगा, लेकिन कुछ भी नहीं दिखाया जाएगा

क्या कोई मेरी मदद कर सकता है?

वेब के समाधान से एकत्रित समाधान "AngularJS – निर्देश के लिए समारोह पास"

एक पृथक गुंजाइश निर्देश के अंदर से माता-पिता के क्षेत्र में एक नियंत्रक फ़ंक्शन को कॉल करने के लिए, ओश ने कहा कि जैसे एचटीएमएल में dash-separated विशेषता नाम का उपयोग करें।

इसके अलावा यदि आप अपने फ़ंक्शन को एक पैरामीटर भेजना चाहते हैं, तो ऑब्जेक्ट पास करके फ़ंक्शन कॉल करें:

 <test color1="color1" update-fn="updateFn(msg)"></test> 

जे एस

 var app = angular.module('dr', []); app.controller("testCtrl", function($scope) { $scope.color1 = "color"; $scope.updateFn = function(msg) { alert(msg); } }); app.directive('test', function() { return { restrict: 'E', scope: { color1: '=', updateFn: '&' }, // object is passed while making the call template: "<button ng-click='updateFn({msg : \"Hello World!\"})'> Click</button>", replace: true, link: function(scope, elm, attrs) { } } }); 

बेला

शायद मुझे कुछ याद आ रहा है, लेकिन यद्यपि अन्य समाधान माता-पिता स्कोप फ़ंक्शन को कॉल करते हैं, तो निर्देश कोड से तर्कों को पार करने की कोई योग्यता नहीं होती है, क्योंकि यह updateFn() update-fn निश्चित पैरामीटर के साथ updateFn() को बुला रहा है, उदाहरण के लिए {msg: "Hello World"} थोड़ी सी परिवर्तन से निर्देश को तर्क देने की अनुमति मिलती है, जो मुझे लगता है कि कहीं अधिक उपयोगी है।

 <test color1="color1" update-fn="updateFn"></test> 

ध्यान दें कि HTML फ़ंक्शन संदर्भ पार कर रहा है, यानी, () कोष्ठक के बिना।

जे एस

 var app = angular.module('dr', []); app.controller("testCtrl", function($scope) { $scope.color1 = "color"; $scope.updateFn = function(msg) { alert(msg); } }); app.directive('test', function() { return { restrict: 'E', scope: { color1: '=', updateFn: '&' }, // object is passed while making the call template: "<button ng-click='callUpdate()'> Click</button>", replace: true, link: function(scope, elm, attrs) { scope.callUpdate = function() { scope.updateFn()("Directive Args"); } } } }); 

तो उपर्युक्त में, एचटीएमएल स्थानीय क्षेत्र callUpdate फ़ंक्शन को बुला रहा है, जिसके बाद माता-पिता के क्षेत्र से अपडेट FN 'लाता है' और पैरामीटर के साथ लौटे हुए फ़ंक्शन को कॉल करता है, जो निर्देश जारी कर सकते हैं।

http://jsfiddle.net/mygknek2/

आपके 'परीक्षण' निर्देश एचटीएमएल टैग में, फ़ंक्शन का विशेषता का नाम नहीं होना चाहिए , लेकिन डैश-आधारित।

इसलिए – के बजाय:

 <test color1="color1" updateFn="updateFn()"></test> 

लिखना:

 <test color1="color1" update-fn="updateFn()"></test> 

डायरेक्टिव एट्रिब्यूट्स (जैसे- अपडेट-एफएन फ़ंक्शन) और फ़ंक्शंस के बीच अंतर को बताने के लिए यह कोणीय का तरीका है।

कैसे द्विदिश बाध्यकारी के साथ नियंत्रक समारोह पारित करने के बारे में? फिर आप इसे नियमित रूप से उसी तरह निर्देशित तरीके से उपयोग कर सकते हैं जैसे कि मैं (सादगी के लिए अप्रासंगिक भागों को छीन लिया):

 <div ng-controller="testCtrl"> <!-- pass the function with no arguments --> <test color1="color1" update-fn="updateFn"></test> </div> <script> angular.module('dr', []) .controller("testCtrl", function($scope) { $scope.updateFn = function(msg) { alert(msg); } }) .directive('test', function() { return { scope: { updateFn: '=' // '=' bidirectional binding }, template: "<button ng-click='updateFn(1337)'>Click</button>" } }); </script> 

मैं इस प्रश्न पर उतरा, क्योंकि मैंने बेफरी से ऊपर की विधि की कोशिश की, लेकिन किसी तरह यह काम नहीं किया। अब यह पूरी तरह से काम करता है

विशेषता नाम के लिए पानी का छींटा और लोअर केस का उपयोग करें (जैसे अन्य उत्तर कहा गया है):

  <test color1="color1" update-fn="updateFn()"></test> 

और निर्देश के क्षेत्र में "और" के बजाय "=" का प्रयोग करें:

  scope: { updateFn: '='} 

तो आप किसी अन्य फ़ंक्शन की तरह updateFn का उपयोग कर सकते हैं:

  <button ng-click='updateFn()'>Click</button> 

तुम वहाँ जाओ!

मुझे "और" के बजाय "=" बाइंडिंग का उपयोग करना पड़ा क्योंकि वह काम नहीं कर रहा था। अजीब सा व्यवहार।