How to write Ng-repeat for below cloudant Nested loop response to my HTML Table..?

Question

//<!--  here is the sample cloudant response we have in that need to filter below docs  -->
    {  
       "data":{  
          "total_rows":3,
          "offset":0,
          "rows":[  
             {  
                "id":"093b21d31878c8cbed02b89ea020c988",
                "key":"093b21d31878c8cbed02b89ea020c988",
                "value":{  },
 <!-- Here we have docs response need to filter -->
                "doc":{  
                   "_id":"093b21d31878c8cbed02b89ea020c988",
                   "_rev":"1-29e2996bce09fd8fcf826871b325302f",
                   "slot":"1",
                   "out_time_stamp":"none",
                   "color":"red",
                   "s.no":35,
                   "vehicle_make":"audi",
                   "vehicle_Make_Model":"Audi A5",
                   "number_plate":"1AU890",
                   "type":"bike",
                   "In_time_stamp":"2-25-21"
                }
             },
             {  },
             {  }
          ]
       },
       "status":200,
       "config":{  
          "method":"GET",
          "transformRequest":[  
             null
          ],
          "transformResponse":[  
             null
          ],
          "username":"****",
          "password":"*****",
          "url":"https://####.cloudant.com/parking_logs/_all_docs?include_docs=true&conflicts=true",
          "headers":{  
             "Accept":"application/json, text/plain, */*"
          },
          "cached":false
       },
       "statusText":"OK"
    }

<!--sample html table --!>
      <table class="table table-no-border m-0">
                                      </thead>
                                        <tr style="color:#232527;">
                                          <th> #No </th>
                                          <th> Vehicle Type </th>
                                          <th> Vehicle Model </th>
                                          <th> Vehicle color </th>
                                          <th> Vehicle Number</th>
               <th> Level</th>
                                          <th> Slot Occupied</th>
               <th> In Time Stamp </th>
               <th> Out Time Stamp </th>
                                        </tr>
             </thead>
              <tbody>
                                        <tr ng-repeat="x in records">
                                          <td >{{ x.sno}}</td>
                                          <td> {{x.type}} </td>
               <td> {{ x.vehicle_make}} </td>
                                          <td> {{x.color}}</td>
                                          <td> {{x.number_plate}}</td>
                                          <td>{{x.vehicle_Make_Model}}</td>
                                          <td> {{x.slot}}</td>
               <td> {{x.In_time_stamp}}</td>
               <td> {{x.out_time_stamp}}</td>
                                        </tr>
              </tbody>
                       </table>

In what way are you stuck? Are you sure you're `ng-repeat`ing over the right list? — nitind, Jun 05 '17 at 20:22
Welcome to Stack Overflow! Please read [what this site is about](https://stackoverflow.com/about) and "[How to ask](https://stackoverflow.com/questions/how-to-ask)" before asking a question. — Ilario Pierbattista, Jun 06 '17 at 06:36

score 0 · Accepted Answer · answered Jun 05 '17 at 20:27

After resolving the promise, pull out the rows from the response. Something like this:

.....function(success) {
$scope.records = success.data.rows;
.......

In your template iterate through the records and bind the values., below

<tr ng-repeat="x in records">
  <td >{{ x.doc.sno }}</td>
   .........
  <td> {{ x.doc.color }}</td>

This should resolve your issue. Let me know if it doesn't work

How to write Ng-repeat for below cloudant Nested loop response to my HTML Table..?

1 Answers1