1

I'm trying to do two nested ng-repeats with two json's, where the second ng-repeat is filtered by the parameter of the first ng-repeat.

First json $scope.matches contains the information on every match in the World Cup. The second json @scope.predictions contains each users predictions for each game.

Now i want to ng-repeat a match as a header, and then list all of the predictions for that specific game. Repeat until every prediction is listed under the right game. I have match.matchnumber = prediction.matchnumber.

In my Plunker http://plnkr.co/edit/GQmYxZiO53nkIBVczaS9?p=preview you can see, that the filter doesn't work, since it applies to every object parameter, and not only matchnumber.

What is the easiest way to make this work? Maybe I should combine the jsons into an filtered array? How would this be done the smart way

TheGuvnor
  • 13
  • 2

1 Answers1

1

In order to filter by specific property, you need to pass an object with the property-name as key and the search-term as value:

ng-repeat="p in predictions | filter:{matchnumber: match.matchnumber}"

The above filter will return only those predictions whose matchnumber property matches match.matchnumber.


See, also, this updated demo.


That said, it is probably not very efficient to loop over all predictions for each match in every digest loop. A better aporoach would be to process both JSONs and build a 3rd one that contains all necessary data, such that no filtering is required in the view.

gkalpak
  • 47,844
  • 8
  • 105
  • 118