值分配給項目裏面* ngFor

Question

我使用的球員名單* ngFor

// Get all players. 
 
getPlayers() { 
 
    this.httpService.getPlayers() 
 
    .subscribe(
 
    player => { 
 
     this.players = player; 
 

 
     for (let i in this.players){ 
 
     if(this.players[i].Main_Image_ID){ 
 
      this.getPlayerIMG(this.players[i].Main_Image_ID); 
 
     } 
 
     } 
 
    }, 
 
    error => this.errorMessage = <any>error); 
 
}

<div ion-item *ngFor="let player of players"> 
 
    <img *ngIf="player?.playerIMG" width="50" [src]="'data:image/png;base64,'+playerIMG" /> 
 
    <img *ngIf="!player?.playerIMG" width="50" src="./assets/images/no-image.jpg" /> 
 
    {{player.First_Name}} {{player.Last_Name}} 
 
</div>

由API調用返回的值返回與多個玩家對象的數組。每個玩家都有一些信息和一個圖片ID。在我訂閱電話並獲得玩家後，該列表將被填充。然後我調用另一個API來獲取圖像，使用imageID。我的目標是在我瞭解所有球員和他們的imageID之後，用他們的形象填充名單上的各個球員。

// Get image for player. 
 
getPlayerIMG(id) { 
 
    this.httpService.getPlayerIMG(id) 
 
    .subscribe(
 
    playerIMG => { 
 
     this.player.playerIMG = playerIMG; 
 
    }, 
 
    error => this.errorMessage = <any>error); 
 
}

的問題是我怎麼可以指定每一個圖像標識調用列表（玩家）在各自的項目（球員）的響應。

謝謝！

Answer 1

，最好是寫播放器的組件，但你可以使用此代碼，並通過播放器的功能，而不是Main_Image_ID

for (let i in this.players){ 
    if(this.players[i].Main_Image_ID){ 
     this.getPlayerIMG(this.players[i]); 
    } 
} 

// Get image for player. 
getPlayerIMG(player) { 
    this.httpService.getPlayerIMG(player.Main_Image_ID) 
    .subscribe(
     playerIMG => { 
     player.playerIMG = playerIMG; 
     }, 
     error => this.errorMessage = <any>error); 
}