angularjs - Displaying an specific image for each item in ng-repeat -

I have a ng-repeat that shows a list of games and beside each game name I want to display a specific image. I want to know how to go about displaying the right PNG for every game. How can I know how the image will appear? Here's how the code looks.

  & lt; Div ng-if = "sport.leagues.length & game check" ng-repeat = "play in game" & gt; & Lt; Ion-list class = "list" & gt; & Lt; Div class = "item" & gt; & Lt; Img src = "" class = "sports-image" & gt; & Lt ;! - Here's where IMG should be - & gt; & Lt; Period & gt; {{Sport.name}} & lt; / Span & gt; & Lt; / Div & gt; & Lt; / Ion list & gt; & Lt; / Div & gt;  

I think you can see the image based on a key (like the name of the game) Want to You can place a Javascript object as the name with the key in your controller and the value can be the URL of the image

obj = {football: 'myurl'}

< / Blockquote>

and use this object

  & lt; Div ng-if = "sport.leagues.length and sports check" ng-repeat = "play in gamefilter = (game | gamefield: query)" & gt; & Lt; Show-remove ion-list = "sport.showStars" class = "list" & gt; & Lt; Div class = "item" & gt; & Lt; Img ng-src = "{{obj [sport.name]}}" class = "sports-image" & gt; & Lt ;! - Here's where IMG should be - & gt; & Lt; Period & gt; {{Sport.name}} & lt; / Span & gt; & Lt; / Div & gt;