Don Rhummy Don Rhummy - 5 months ago 7
AngularJS Question

If a table's rows are created by ng-repeat from return of one method, how set one of the rows by another method call?

I have a function that gets all players on a team. That function is called on page load and then is used to create a row of data in a table like this

getTeamPlayers(teamName)
:

<tr ng-repeat="player in teamPlayers">
<td><a href="#/players/{{player.id}}">{{player.name}}</a></td>
<td><!-- want to put in here isMVP --></td>
</tr>


There's a second API call to find the MVP's player id. I want to:


  1. Call that method
    getLeagueMVP()

  2. Set the proper cell for the player that is the MVP (if they're on this team and their id matches the MVP player's id)



How do I do both #1 and #2?

Answer

How about something like this?

<tr ng-repeat="player in teamPlayers">
    <td><a href="#/players/{{player.id}}">{{player.name}}</a></td>
    <td ng-if="player.MVP == true">MVP</td>
</tr>



var teamPlayers = getTeamPlayers();
var mvp = getLeagueMVP();
for (var i = 0; i < teamPlayers.length; i++) {
    if (teamPlayers[i].id == mvp.id) {
        teamPlayers[i].mvp = true;
    }
}    

You load players, then load mvp info, then look at all of the players, for each player, if this player's id is equal to the mvp's id, set the player's mvp value as true. Angular's data binding will understand that you've updated the array and should just update the ng-repeat table.

FYI I don't know any of your variable names or what these functions return =]