मैं AngularJS का उपयोग कर ब्राउज़र के कंसोल में $ स्कोप चर का उपयोग कैसे करूं?

$ कोड स्कोप वेरिएबल के संदर्भ के करीब कहीं भी अपने कोड में ब्रेकपॉइंट रखें (ताकि $ स्कोप वर्तमान 'सादे पुरानी जावास्क्रिप्ट' स्कोप में हो)। फिर आप कंसोल में $ स्कोप मान का निरीक्षण कर सकते हैं।

अगर आपने Batarang स्थापित किया है

तो आप बस लिख सकते हैं:

$scope

जब आपके पास क्रोम में तत्वों के दृश्य में चयनित तत्व होता है। रेफरी - https://github.com/angular/angularjs-batarang#console

इनमें से कई उत्तरों के लिए एक चेतावनी: यदि आप अपने नियंत्रक को उपनाम करते हैं तो आपकी गुंजाइश वस्तुएं वस्तु से scope() वस्तु के भीतर किसी ऑब्जेक्ट में होंगी।

उदाहरण के लिए, यदि आपका नियंत्रक निर्देश इस प्रकार बनाया गया है: <div ng-controller="FormController as frm"> फिर अपने नियंत्रक की angular.element($0).scope().frm.startDate गुण तक पहुंचने के लिए, आप angular.element($0).scope().frm.startDate को कॉल करेंगे angular.element($0).scope().frm.startDate

एक वैश्विक चर के रूप में बस $scope असाइन करें। समस्या सुलझ गयी।

app.controller('myCtrl', ['$scope', '$http', function($scope, $http) {
    window.$scope = $scope;
}

हमें वास्तव में उत्पादन के मुकाबले विकास में $scope की आवश्यकता है।

@JasonGoemaat द्वारा पहले से उल्लेख किया गया है लेकिन इसे इस प्रश्न के उपयुक्त उत्तर के रूप में जोड़ रहा है।

कोणीय में हम angular.element () द्वारा jquery तत्व मिलता है .... सी चलो ...

angular.element().scope();

उदाहरण:

<div id=""></div>

जेएम के जवाब पर सुधार करने के लिए ...

// Access whole scope
angular.element(myDomElement).scope();

// Access and change variable in scope
angular.element(myDomElement).scope().myVar = 5;
angular.element(myDomElement).scope().myArray.push(newItem);

// Update page to reflect changed variables
angular.element(myDomElement).scope().$apply();

या यदि आप jQuery का उपयोग कर रहे हैं, तो यह वही काम करता है ...

$('#elementId').scope();
$('#elementId').scope().$apply();

कंसोल से डीओएम तत्व तक पहुंचने का एक और आसान तरीका (जैसा कि जेएम उल्लिखित है) 'तत्व' टैब में उस पर क्लिक करना है, और यह स्वचालित रूप से $0 रूप में संग्रहीत हो जाता है।

angular.element($0).scope();

तत्व का निरीक्षण करें, फिर कंसोल में इसका उपयोग करें

s = $($0).scope()
// `s` is the scope object if it exists

बस दायरे के बाहर एक जावास्क्रिप्ट चर परिभाषित करें और इसे अपने नियंत्रक में अपने दायरे में असाइन करें:

var myScope;
...
app.controller('myController', function ($scope,log) {
     myScope = $scope;
     ...

बस! यह सभी ब्राउज़रों में काम करना चाहिए (कम से कम क्रोम और मोज़िला में परीक्षण किया गया)।

यह काम कर रहा है, और मैं इस विधि का उपयोग कर रहा हूँ।

मैं आमतौर पर इसके लिए jQuery डेटा () फ़ंक्शन का उपयोग करता हूं:

$($0).data().$scope

$ 0 वर्तमान में क्रोम डोम इंस्पेक्टर में आइटम चुना गया है। $ 1, $ 2 .. और इसी तरह पहले से चुने गए आइटम हैं।

मैं ऑब्जेक्ट चुनने के बाद angular.element($0).scope() का सबसे अच्छा मानता हूं (यह angular.element($0).scope() या jQuery के साथ भी छोटा है: $($0).scope() (मेरा पसंदीदा))

इसके अलावा, अगर मेरे जैसे आप body तत्व पर एक मुख्य दायरा है, एक $('body').scope() ठीक काम करता है।

यह बटरंग के बिना गुंजाइश पाने का एक तरीका है, आप कर सकते हैं:

var scope = angular.element('#selectorId').scope();

या यदि आप नियंत्रक नाम से अपना दायरा खोजना चाहते हैं, तो ऐसा करें:

var scope = angular.element('[ng-controller=myController]').scope();

आपके मॉडल में बदलाव करने के बाद, आपको कॉल करके परिवर्तनों को लागू करने की आवश्यकता होगी:

scope.$apply();