2013-01-11 13 views
35

मैंने अपने कोणीय ऐप में एक कारखाना/सेवा बनाई है।ब्राउज़र में कोणीय सेवाओं को डीबग कैसे करें

मैं इसे ब्राउज़र में डीबग करना चाहता हूं। क्या कोई तरीका है कि मैं इसके उदाहरण तक पहुंच सकता हूं और जांच कर सकता हूं कि उसके कार्यों और चर के मूल्य क्या हैं।

कोणीय दायरे का उपयोग करके पहुँचा जा सकता है

angular.element(e).scope() 

वहाँ कारखानों तक पहुँचने के लिए एक ऐसी ही रास्ता नहीं है?

उत्तर

65

मेरा मानना ​​है कि आप कुछ इस तरह का उपयोग कर सकते हैं:

angular.element(e).injector().get('serviceName') 

और AngularJS सेवाओं के बाद से एकमात्र, किसी भी angular.element पर यह कर हमेशा एक ही सेवा उदाहरण/वस्तु वापस आ जाएगी है।

+4

+1 यह बहुत अच्छा है। इसके साथ डीबगिंग बहुत आसान हो जाती है। कोणीय दस्तावेज के लिए एक लिंक जोड़ने से उपयोगिता में और भी सुधार होगा। रेफरी: http://docs.angularjs.org/api/angular.element – rubish

+1

क्या यह अभी भी मान्य है? यह पहले ठीक काम कर रहा था। लेकिन अब यह कहता है 'संदर्भ त्रुटि: ई परिभाषित नहीं है' –

+2

@IvanWang हाँ, यह अभी भी मान्य है। बस परीक्षण किया और यह काम कर रहा है। क्या आप सुनिश्चित हैं कि 'ई' चर परिभाषित और सुलभ है? (क्या यह एक समस्या हो सकती है [यह] (http://stackoverflow.com/questions/13326351/uncaught-referenceerror-e-is-not-defined)?) – bmleite

8

किसी भी नियंत्रक में अपने सेवा सम्मिलित करें और उसके बाद console.log(myService);

Fiddle

+0

+1 जवाब – murtaza52

3

मैं इसे कैसे सेवाओं का निरीक्षण जैसे बारे में निश्चित नहीं हूँ, लेकिन कोणीय Batarang कोणीय क्षुधा डीबगिंग के लिए एक महान क्रोम विस्तार है। मददगार हो सकता है।

https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk

Batarang के लिए उपयोगी प्रलेखन:

http://www.c-sharpcorner.com/UploadFile/9c2805/getting-started-with-angularjs-batarang/

6

तरह @bmleite ने कहा, आप का उपयोग कर सकते हैं:

angular.element({DOM element}).injector().get('serviceName') 

आप चाहते थे DOM एलीमेंट उपयोग 'तत्वों का चयन कर सकते ('क्रोम developper उपकरण पर टैब या' एचटीएमएल 'फ़ायरफ़ॉक्स/Firebug पर टैब) और फिर उस पर बात करने के लिए $ 0 का उपयोग' कंसोल 'टैब।

चुनने का सबसे सरल तत्व वह है जिस पर आपके पास ngApp निर्देश है। अंतिम कोड है:

myService.getConfig('dev'); 
4

ng-inspect क्रोम एक्सटेंशन का प्रयास करें:

var myService = angular.element($0).injector().get('serviceName'); 

तो फिर तुम अपने सभी चर और कार्यों की पहुंच है।

$ कंसोल में ('SERVICENAME') प्राप्त सेवा या कारखाने उदाहरण वापस आ जाएगी।

+2

एनजी-निरीक्षण के लिए कोणीय Batarang तुलना में बहुत अधिक मूल्यांकन किया है –

संबंधित मुद्दे