How to find nested json object with angularjs?

Question

How can I find a rather nested JSON object and output in with AngularJS? I've been messing with it for quite some time now but I just can't seem to get it right.. Hope you guys can help me out!

HTML:

<div id="ng-app" ng-controller="AnalyticsCtrl">
    <div ng-repeat="post in posts">
        <span>{{post.title}}</span>
        <span>{{post.counter}}</span>
    </div>
</div>

JSON: I'm trying to fetch the post title, and the counter

{
"status" : "success",
"data" : 
    {
        "activeVisitors" : "148",
        "posts" : 
        [
            {
                "id" : 1,
                "title" : "Bla blabla blablabl bla blablaba",
                "counter" : "20"
            },
            {
                "id" : 2,
                "title" : "Blie bla blup wflup flel del",
                "counter" : "18"
            },
            {
                "id" : 3,
                "title" : "Flel djep flep tro fro klel",
                "counter" : "14"
            }
        ]
    }
}

Ctrl:

'use strict';

var myApp = angular.module('myApp', []);

myApp.controller('AnalyticsCtrl', ['$scope', '$http', function($scope,$http) {
$http({method:'POST', url: 'jsonData.php', headers: {}})
.success(function(data) {
    $scope.posts = data;
});
}]);

in place of post in posts use post in YourVar.data.posts — Satpal
– Satpal, Commented Feb 20, 2014 at 14:55

Satpal · Accepted Answer · 2014-02-20 15:04:42Z

2

Instead of

 <div ng-repeat="post in posts">

use

 <div ng-repeat="post in posts.data.posts">

OR

You can alternatively modify Controller and use your existing HTML

Controller

$http({method:'POST', url: 'jsonData.php', headers: {}})
.success(function(data) {
    $scope.posts = data.data.posts;
});

answered Feb 20, 2014 at 15:04

Satpal

134k13 gold badges168 silver badges171 bronze badges

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

1 Comment

Geert Van de Langenberg Over a year ago

Thanks for the info! Might there be any way to multiply (or do any kind of maths) the counter with the activeVisitors in the same ng-repeat?

Collectives™ on Stack Overflow

How to find nested json object with angularjs?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related