How do i access the data in json object in Angularjs

Question

I am trying to access a the data in a json object using angular but i finding it difficult to this at the moment and hopefully you can help me here.

so i have a function in my controller like this:

var vm = this;
vm.getData = getData;
vm.data = [];


 function getData() {
        var promise = appService.getAll(vm.query);
        promise.then(function(response) {
            vm.data = response.data,
                    console.log(vm.data);
            },
            function(error) {
                $log.error("an error here", error);
            });


    }

and my view goes something like this:

<div> 


<table class="table">
        <tr >
            <th> Department</th>


        </tr >
        <tr ng-repeat="n in vm.data">
            <td>{{n.sectionName}} </td>
        </tr>


    </table>


</div>

Everything works .. i retrieve my json object as required .. but its just accessing them is where i am having in issue as the above context in my view is not dispplayed .. so in my example above i am trying to acess a json with the heaser of "sectionName" and displaying it in my view.

here is a visual of of the json object in my console ...

Thank you for your time

if the response object as in the image have results as the data array, then why you call response.data, shouldn't it be response.results? — RaniDevpr
– RaniDevpr, Commented Dec 16, 2015 at 15:26

sma · Accepted Answer · 2015-12-16 14:58:31Z

1

If results is the data you need to display, then you should adjust your markup to be this:

<tr ng-repeat="n in vm.data.results">
    <td>{{n.sectionName}} </td>
</tr>

answered Dec 16, 2015 at 14:58

sma

9,5978 gold badges53 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

stan · Accepted Answer · 2015-12-16 14:58:16Z

0

You are looping over the object itself. Instead, you have to loop over the results array inside the object.

<div> 


<table class="table">
        <tr >
            <th> Department</th>


        </tr >
        <tr ng-repeat="n in vm.data.results">
            <td>{{n.sectionName}} </td>
        </tr>


    </table>


</div>

answered Dec 16, 2015 at 14:58

stan

4,9936 gold badges52 silver badges77 bronze badges

1 Comment

1future Over a year ago

yup thats right .. it was vm.data.response.results.. thank you

Collectives™ on Stack Overflow

How do i access the data in json object in Angularjs

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related