how to debug the $rootScope object of angularjs in the browser

前端 未结 7 1677
醉话见心
醉话见心 2021-01-29 23:43

Is there a way of debugging the angularjs application when it is loaded in the browser?

ie. I wish to get the $rootScope of my current application. How woul

相关标签:
7条回答
  • 2021-01-30 00:22

    In developer console type angular.element('body').scope(); in case of your app is <body data-ng-app="SomeApp">

    0 讨论(0)
  • 2021-01-30 00:28

    In the developer console try this

    $rootScope = angular.element(document).scope()
    
    0 讨论(0)
  • 2021-01-30 00:29

    For those using $compileProvider.debugInfoEnabled(false); and ng-strict-di just paste this in the console and $rootScope will be logged and added to window:

    function getRootScope($rootScope){ console.log(window.$rootScope = $rootScope); }
    getRootScope.$inject = ["$rootScope"];
    angular.element(document.querySelector('[data-ng-app],[ng-app]')).injector().invoke(getRootScope);
    
    0 讨论(0)
  • 2021-01-30 00:36

    Just wanted to add that there is a free Chrome Extension called "Angular Scope Inspector" (current store url) that will automatically inspect scope of selected elements in the developer tools elements tab

    I just discovered it today, and it's very useful, IMO

    0 讨论(0)
  • 2021-01-30 00:38

    Batarang -- A Google Chrome plugin for AngularJS

    After you installed this, you can do

    console.log($rootScope);

    and check the scope object in your chrome console.

    BTW, if you want to get $rootScope, you need to inject to your controller

    like

    app.controller('MainCtrl', function($scope, $rootScope) {
    
    }
    
    0 讨论(0)
  • 2021-01-30 00:46

    +1 for Batarang

    Also, you can get the scope from any element in the DOM by executing the following from the console

    angular.element(DOMNODE).scope()
    

    Where DOMNODE, is of course, a reference to a DOM node.

    For example, in Chrome in the elements tab you can select the node where the ng-app directive is, and get the root scope with

    angular.element($0).scope()
    
    0 讨论(0)
提交回复
热议问题