mcadio
mcadio

Reputation: 769

ng-repeat with nested ng-repeat between parent data

I have an array of objects with a players array. I'd like to display the info in a table row, but with the nested array's values in the middle of the row. I get all the info except the last column. It comes up blank telling me it's an invalid key.

<table class="table table-condensed table-striped"ng-show="vm.registrations.length > 0">
    <thead>
        <td>Day</td>
        <td>Field</td>
        <td>Event</td>
        <td colspan="4">Players</td>
        <td>Status</td>
    </thead>
    <tbody>
        <tr ng-repeat="event in vm.registrations" >
        <td>{{event.day}}</td>
        <td>{{event.field | uppercase }}</td>
        <td>{{event.event}}</td>
        <td colspan="4" ng-if="event.numplayers == 2">
            <span ng-repeat="player in event.players">
              <span>{{player.first}} {{player.last}}</span>
              <span ng-show="$last">, </span>
            </span>
        </td>
        <td>
            <span class="label label-sucess" ng-if="{{event.active}} == true">ACTIVE</span>
            <span class="label label-danger" ng-if="{{event.active}} == false">Canceled</span>
        </td>
        </tr>
    </tbody>
</table>

Data should appear like (but the last column is blank, except the header):

Day     Field     Event      Players     Status
Sat     MAIN      Mens B     Bob, John   Active
Sun     COED      COED A     Bob, Mary   Canceled

This is what I get:

Day     Field     Event      Players     Status
Sat     MAIN      Mens B     Bob, John   
Sun     COED      COED A     Bob, Mary   

How do I get back to the parent ng-repeat to finish the display?

Upvotes: 0

Views: 105

Answers (1)

Karim
Karim

Reputation: 8632

typo here

 <span ng-show"$last">

you forgot the equals

 <span ng-show="$last">

that's why you're not seeing the last element of your ng-repeat

Upvotes: 2

Related Questions