CODEWITHSUNDEEP
angularjsangularjs-filter
Ryan Exlay
Ryan Exlay

Reputation: 361

angular filter to search in object array

I have an array that extracted from db named competition

competition:[{id:1, 
              name:city marathon,
              athletes:[{id:1, name: Ashley},{id:2, name: Jphn},{id:3, name: Kim},{id:4, name: Nick}],
              prize[{id:1,comp_id:1,prize_num:1,athlete_id:3},{id:2,comp_id:1,prize_num:2,athlete_id:1}] }]

I wish to display prize beside of Athletes who won prized like below

City Marathon
Athelete: Ashley (2nd Prize), John, Kim (1st Prize), Nick

How can I do like that?

Upvotes: 2

Views: 852

Answers (1)

shivas
shivas

Reputation: 923

Here is one way you could display the results based on your requirements. Check out this plunker for a working example.

Basically from the way you have your data in the database, do an ng-repeat on the competitions and inside that you do a ng-repeat on the athletes. Then for each athlete see if they have a prize for that event.

Hope this helps and gives you a starting point to your solution

HTML:

<body ng-controller="MainCtrl">
    <div class="panel panel-default" ng-repeat="event in competitions">
      <div class="panel-heading"><strong>{{event.name}}</strong></div>
      <div class="panel-body">
        <strong>Atheletes:</strong>&nbsp;
        <span ng-repeat="athelete in event.athletes">{{athelete.name}}
        <span class="text-info">{{GetPrize(event.prizes,athelete)}}</span>
        &nbsp;</span>
      </div>
    </div>
  </body>

Controller:

app.controller('MainCtrl', function($scope) {
  $scope.competitions = [{
    "id": 1,
    "name":"City Marathon",
    "athletes":[{"id":1, "name": "Ashley"},{"id":2, "name": "John"},{"id":3, "name": "Kim"},{"id":4, "name": "Nick"}],
    "prizes": [{"id":1,"comp_id":1,"prize_num":1,"athlete_id":3},{"id":2,"comp_id":1,"prize_num":2,"athlete_id":1}]
  },
  {
    "id": 1,
    "name":"5K Marathon",
    "athletes":[{"id":1, "name": "Ashley"},{"id":2, "name": "John"},{"id":3, "name": "Kim"},{"id":4, "name": "Nick"}],
    "prizes": [{"id":1,"comp_id":1,"prize_num":1,"athlete_id":4},{"id":2,"comp_id":1,"prize_num":2,"athlete_id":2}]
  }
  ];

  $scope.GetPrize = function(prizes,athelete){
    var prize_info ="";
    for(var i=0;i<prizes.length;i++){
      if(prizes[i].athlete_id == athelete.id){
        prize_info = "("+prizes[i].prize_num+" Prize)";
      }
    }
    return prize_info;
  }

})

Upvotes: 1

Related Questions