"कैसे करता है this
और $scope
AngularJS नियंत्रकों में काम करता है?"
संक्षिप्त उत्तर :
this
- जब नियंत्रक कंस्ट्रक्टर फ़ंक्शन को कहा जाता है,
this
तो नियंत्रक है।
- जब किसी
$scope
ऑब्जेक्ट पर परिभाषित फ़ंक्शन को कहा जाता है, this
तो "प्रभाव में गुंजाइश तब होती है जब फ़ंक्शन कहा जाता था"। यह हो सकता है (या नहीं!) हो सकता है $scope
कि फ़ंक्शन को परिभाषित किया गया है। तो, समारोह के अंदर, this
और $scope
हो सकता है नहीं ही होना।
$scope
- हर कंट्रोलर के पास एक संबद्ध
$scope
ऑब्जेक्ट होता है।
- एक नियंत्रक (कंस्ट्रक्टर) फ़ंक्शन मॉडल की संपत्तियों और कार्यों / व्यवहार को इसके संबद्ध पर सेट करने के लिए जिम्मेदार है
$scope
।
- इस
$scope
ऑब्जेक्ट (और पैरेंट स्कोप ऑब्जेक्ट्स, यदि प्रोटॉपिकल इनहेरिटेंस प्ले में हैं) पर परिभाषित केवल विधियाँ HTML / दृश्य से सुलभ हैं। जैसे, ng-click
फिल्टर, आदि से।
लंबे उत्तर :
एक नियंत्रक फ़ंक्शन एक जावास्क्रिप्ट निर्माता फ़ंक्शन है। जब कंस्ट्रक्टर फ़ंक्शन निष्पादित होता है (उदाहरण के लिए, जब एक लोड होता है), this
(यानी, "फ़ंक्शन संदर्भ") नियंत्रक ऑब्जेक्ट पर सेट होता है। इसलिए "टैब" कंट्रोलर कंस्ट्रक्टर फंक्शन में, जब ऐडपैन फंक्शन बनता है
this.addPane = function(pane) { ... }
इसे नियंत्रक वस्तु पर बनाया गया है, $ स्कोप पर नहीं। AddPane फ़ंक्शन को दृश्य नहीं देख सकते हैं - उनके पास केवल $ गुंजाइश पर परिभाषित फ़ंक्शन तक पहुंच है। दूसरे शब्दों में, HTML में, यह काम नहीं करेगा:
<a ng-click="addPane(newPane)">won't work</a>
"टैब" नियंत्रक निर्माता फ़ंक्शन निष्पादित करने के बाद, हमारे पास निम्नलिखित हैं:
धराशायी काली रेखा, प्रोटोटाइप विरासत को इंगित करती है - स्कोप से एक अलग गुंजाइश प्रोटोटाइपिक विरासत । (यह HTML में निर्देश का सामना करने वाले प्रभाव के दायरे से प्रोटोटाइप के वारिस नहीं है।)
अब, फलक निर्देश का लिंक फ़ंक्शन टैब निर्देश के साथ संवाद करना चाहता है (जिसका वास्तव में मतलब है कि यह टैब को किसी तरह से अलग करने की गुंजाइश को प्रभावित करने की आवश्यकता है)। घटनाओं का इस्तेमाल किया जा सकता है, लेकिन एक अन्य तंत्र के लिए require
टैब नियंत्रक को फलक निर्देशन करना है। ( require
टैब के $ दायरे में फलक निर्देश के लिए कोई तंत्र प्रतीत नहीं होता है ।)
तो, यह सवाल भी पैदा करता है: यदि हमारे पास केवल टैब नियंत्रक तक पहुंच है, तो हम टैब की पहुंच को $ गुंजाइश को अलग कैसे करते हैं (जो कि हम वास्तव में चाहते हैं)?
खैर, लाल बिंदीदार रेखा इसका जवाब है। AddPane () फंक्शन का "स्कोप" (मैं जावास्क्रिप्ट फंक्शन स्कोप / यहाँ क्लोजर की बात कर रहा हूँ) फंक्शन एक्सेस को टैब में अलग-अलग $ स्कोप देता है। यानी, addPane () में एक क्लोजर के कारण ऊपर दिए गए आरेख में "टैब IsolateScope" तक पहुंच है, जो कि addPane () को परिभाषित करते समय बनाया गया था। (यदि हम इसके बजाय टैब $ स्कोप ऑब्जेक्ट पर addPane () को परिभाषित करते हैं, तो फलक निर्देश इस फ़ंक्शन तक पहुंच नहीं होगा, और इसलिए इसका टैब $ स्कोप के साथ संवाद करने का कोई तरीका नहीं होगा।)
अपने प्रश्न के अन्य भाग का उत्तर देने के लिए how does $scope work in controllers?
:
$ स्कोप पर परिभाषित कार्यों के भीतर, this
"फ़ंक्शन में / जब कॉल किया गया था, तब प्रभाव में $ स्कोप" पर सेट है। मान लें कि हमारे पास निम्नलिखित HTML हैं:
<div ng-controller="ParentCtrl">
<a ng-click="logThisAndScope()">log "this" and $scope</a> - parent scope
<div ng-controller="ChildCtrl">
<a ng-click="logThisAndScope()">log "this" and $scope</a> - child scope
</div>
</div>
और ParentCtrl
(एकमात्र) है
$scope.logThisAndScope = function() {
console.log(this, $scope)
}
पहली लिंक पर क्लिक करने कि दिखाएगा this
और $scope
एक ही हैं, क्योंकि " प्रभाव में गुंजाइश जब समारोह कहा जाता था " के साथ जुड़े गुंजाइश है ParentCtrl
।
दूसरे लिंक पर क्लिक करने से पता चलेगा this
और $scope
ये समान नहीं हैं , क्योंकि " प्रभाव में स्कोप जब फंक्शन को कहा जाता है " से संबंधित स्कोप है ChildCtrl
। तो यहाँ, this
पर सेट किया जाता ChildCtrl
है $scope
। विधि के अंदर, $scope
अभी भी ParentCtrl
$ गुंजाइश है।
बेला
मैं this
$ स्कोप पर परिभाषित फ़ंक्शन के अंदर का उपयोग न करने की कोशिश करता हूं , क्योंकि यह भ्रमित हो जाता है कि कौन सा $ स्कोप प्रभावित हो रहा है, विशेष रूप से यह देखते हुए कि एनजी-रिपीट, एनजी-इनकॉल, एनजी-स्विच, और निर्देश सभी अपने स्वयं के चाइल्ड स्कोप बना सकते हैं।