I have a table that is pulling data from a json file and populating td with ng-repeat. However, I want my first column (Line #) to stay the same. For example just 1,2,3,4 to represent which phone line the customer is on, and the rest of the data to be populated with the ng-repeat. I've been researching and have not been able to find anything any help is appreciated. Code is below.
<tr>
<th>Line #</th>
<th>Name</th>
<th>Phone #</th>
<th>Range</th>
</tr>
<tr ng-repeat="customer in customers | orderBy: 'id' | limitTo: 4" ng-class="{ 'alert-danger' : customer.in == 'no', 'alert-success' : customer.in == 'yes', 'alert-warning' : customer.in == 'unknown' }">
<td>1</td>
<td>{{customer.name}}</td>
<td>{{customer.phoneNumber}}</td>
<td>{{customer.in}}</td>
</tr>
</table>
<div class="modal-close" ng-click="toggleModal()">X</div>
</div>
Angular's ng-repeat
exposes an $index
property that will return the current index of the array. So your HTML could look like:
<tr ng-repeat="customer in customers | orderBy: 'id' | limitTo: 4" ng-class="{ 'alert-danger' : customer.in == 'no', 'alert-success' : customer.in == 'yes', 'alert-warning' : customer.in == 'unknown' }">
<td>{{$index + 1}}</td>
<td>{{customer.name}}</td>
<td>{{customer.phoneNumber}}</td>
<td>{{customer.in}}</td>
</tr>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.