ng-repeat not iterating through json object

Question

The controller which contains the JSON object, which is then passed to the view.

'use strict';

//app global variable
//this is the controller that handles post requests
//declare services as dependecies $http, $location, custom service apiServiceWeb
app.controller('menteeMentorsCtrl', function($scope, $http, $cookies, $rootScope, $location, loggedInStatus, setCredentials, apiServiceWeb) {


  //get cookie, and then make api call
  var cookieData = setCredentials.getCookie('globals');

  console.log(cookieData);
  console.log("email " + cookieData.auth.username);
  console.log("userType " + cookieData.auth.userType);
  console.log("token " + cookieData.auth.token);

  var ctr_scope = $scope;
  $scope.users = []; //declare an empty array

  $scope.alert = {};
  $scope.showAlert = false;
  $scope.users = [{
    "activeMentors": [{
      "profession": "test",
      "lastName": "test",
      "jobTitle": "test",
      "chatIdentifier": "e46eacf0f7dbd998aba9957b127b51935cbd4fed68533d5708e22c632b60eaa4d65c81fc3cfe3192112c02db1ab4090bc0f18f8a8fdb8cd60f4368643a9a5dbd",
      "title": "",
      "pushToken": "tets",
      "token": {
        "secureToken": "c243fac3ee241f9cb7c442ec893a9c58d85312b890af8719949057e61c3d6a7670455e178a692f27ae0e07da89b4b5d6b0d4267df799249969c70a829cbbab9d"
      },
      "mentees": [],
      "firstName": "test",
      "profileColour": "test",
      "emailAddress": "test",
      "termsAgreed": test,
      "ambition": {
        "ambition": "test",
        "isPrivate": "test"
      },
      "dob": "21/04/1991",
      "busy": test,
      "describingWords": [
        "tese",
        "test",
        "",
        "",
        ""
      ],
      "userType": "mentor",
      "id": {
        "machineIdentifier": 12374093,
        "processIdentifier": 7963,
        "counter": 705715,
        "timestamp": 1439803213
      },
      "requestedMentees": [],
      "profileImageUrl": "test"
    }],
    "requestedMentors": [{
      "profession": "test",
      "lastName": "test",
      "jobTitle": "test",
      "title": "test",
      "mentees": [],
      "firstName": "test",
      "emailAddress": "test",
      "termsAgreed": false,
      "ambition": {
        "ambition": "",
        "isPrivate": "TRUE"
      },
      "dob": "20/06/80",
      "busy": false,
      "describingWords": [
        "Compassionate",
        "Independent",
        "Passionate",
        "Inquisitive",
        "Creative"
      ],
      "userType": "tets",
      "id": {
        "machineIdentifier": 12374093,
        "processIdentifier": 7963,
        "counter": 705580,
        "timestamp": 1439775250
      },
      "requestedMentees": [],
      "profileImageUrl": "test"
    }]
  }];

});

View:

This is where I use ng-repeat.

 <div role="main" class="container theme-showcase">
      <div class="" style="margin-top:90px;">
        <div class="col-lg-8">
            <div class="page-header">
                <h2 id="tables">list items</h2>
            </div>
            <div class="bs-component" ng-controller="menteeMentorsCtrl">
                <div class="alert alert-info" ng-hide=true>
                    <p>Sort key: {{sortKey}}</p>
                    <p>Reverse: {{reverse}}</p>
                    <p>Search String : {{search}}</p>
                </div>
                <form class="form-inline">
                    <div class="form-group">
                        <label >Search</label>
                        <input type="text" ng-model="search" class="form-control" placeholder="Search">
                    </div>
                </form>

<div ng-repeat="test in users.requestedMentors">
 <span>Name : {{ test.firstName }}</span>
 <span>Age : {{ test.lastName }}</span>
</div>


        </div>
      </div>
    </div>

There are two parent objects in the json object, when I do test in users.requestedMentors , nothing is returned, why is this happening, thanks.

Answer 1

You should use

<div ng-repeat="test in users[0]['requestedMentors']">
 <span>Name : {{ test.firstName }}</span>
 <span>Age : {{ test.lastName }}</span>
</div>

Explaination

This is because users is itself an array of objects and you are trying to acccess the first element of it.

Update

If there are multiple objects in the users array you should use ng-repeat

Eg:

<div ng-repeat="user in users">
  <div ng-repeat="test in user['requestedMentors']">
     <span>Name : {{ test.firstName }}</span>
     <span>Age : {{ test.lastName }}</span>
  </div>
</div>

Answer 2

In your case, users is an array object. Before accessing the each object inside the user array, you need to loop over the users object first. you should have something like this.

<div ng-repeat="user in users">
<div ng-repeat="test in user.requestedMentors">
  <span>Name : {{ test.firstName }}</span>
  <span>Age : {{ test.lastName }}</span>
</div>