ng-repeat不迭代json对象

时间:2015-08-20 12:05:13

标签: javascript json angularjs

包含JSON对象的控制器,然后传递给视图。

'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"
    }]
  }];

});

查看:

这是我使用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>

json对象中有两个父对象,当我在users.requestedMentors中测试时,没有返回任何内容,为什么会发生这种情况,谢谢。

2 个答案:

答案 0 :(得分:3)

你应该使用

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

<强>释

这是因为users本身就是array of objects,你正试图让它的第一个元素进入。

<强>更新

如果objects数组中有多个users,您应该使用ng-repeat

例如:

<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>

答案 1 :(得分:0)

在您的情况下,用户是一个数组对象。在访问用户数组中的每个对象之前,需要首先遍历用户对象。你应该有这样的东西。

,