how to Access AngularJS object in AngularJS

Question

This is my Angular code. I am getting an array of userInfo through AngularJS services.

app.controller('personalController', function ($scope, $http, $window, userInfo) {

    $scope.info = userInfo.getValue();
    console.log( $scope.info);
    //$scope.data = $scope.info;
    console.log($scope.info.inf.CNIC);
}

This is my Angular service:

app.service('userInfo', function () {
    var infor = {};
    this.setValue = function (info) {
        infor["inf"] = info;
    }
    this.getValue = function (info) {
        return infor;
    }
})

I am getting the following values:

And I am getting cannot read the property error in console.log($scope.info.inf.CNIC); .

Answer 1

Here's what I do to reach to my angularjs objects.

In your controller you set

window.test = $scope;

Then in your developer console you can reach to your angular objects like below

test.info

Answer 2

If you are using Chrome you can do the following:

Select the element you want to get the scope from via right-clicking and Inspect Element on from the browser, or selecting the element from the Elements tab of the Dev Tools, this will cause $0 to point to the element when referenced in the Dev Tools console.

In dev tools console you can use the below statement and get the scope:

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

So to recap:

1. Right click on the element you want to get the scope and click inspect Element
2. type var sc = angular.element($0).scope();
3. Check the data inside sc variable