How do I parse json array object with Angular.js?

Question

I am consuming a Yammer RESTful API with AngularJS. I have been able to get the yammer user.json api to work but need guidance consuming and displaying the yammer messages.json api. If anybody could help with the scope syntax, that would be cool.

Parse json to return messages > body > rich Here is the code:

Controller

class="bbo_tr_t">
    <table class="bbo_t_l">
    <tr><td class="bbo_tll" align="left">Title</td><td class="bbo_tlv">#4796 Ind.  ACBL Fri 2pm</td></tr>
    <tr><td class="bbo_tll" align="left">Host</td><td class="bbo_tlv">ACBL</td></tr>
    <tr><td class="bbo_tll" align="left">Tables</td><td class="bbo_tlv">9</td></tr>



    </table>

    </div><div class='sectionbreak'>Section 1 </div><div class='onesection'> <table class='sectiontable' ><tr><th>Name</th><th>Score (IMPs)</th><th class='rank'>Rank</th><th>Prize</th><th>Points</th></tr>
<tr class='odd'><td>colt22</td><td><a href="http://www.bridgebase.com/myhands/hands.php?tourney=4796-1455303720-&username=colt22" target="_blank">42.88</a></td><td class='rank' >1</td><td></td><td>0.90</td></tr>
<tr class='even'><td>francha</td><td><a href="http://www.bridgebase.com/myhands/hands.php?tourney=4796-1455303720-&username=francha" target="_blank">35.52</a></td><td class='rank' >2</td><td></td><td>0.63</td></tr>
<tr class='odd'><td>MSMK</td><td><a href="http://www.bridgebase.com/myhands/hands.php?tourney=4796-1455303720-&username=MSMK" target="_blank">34.38</a></td><td class='rank' >3</td><td></td><td>0.45</td></tr>

JSON

function YammerGetUserCtrl($scope, $http ) {  
 $http.get('https://api.yammer.com/api/v1/messages.json', {headers: {'Authorization': 'Bearer xxxxxxxxxxxxxxx'}}).  
      success(function(data) {  
       $scope.users = data;  
      console.log($scope.users)  
     });  
 }

So I would like to display the url and rich excerpt from the body. How can I do it?

Answer 1

Edit, here is the AngularJS solution.

.BAS

and in HTML

$http.get("your_data").success(function (data) 
{ 
   $scope.users = data.messages; 
   console.log("users" , $scope.users); 
}); 

To directly access the <div ng-repeat="user in users" > <div>Rich: {{user.body.rich}}</div> <div>URL: {{user.url}}</div> </div> property, you can use this code: rich. Similar goes for user.messages[0].body["rich"] Explanation: messages has an array with one element, and the object url which has the property body. See below my results after debugging in the console.